Foros del Web » Programando para Internet » Javascript »

Problema funcion para alterar el Left y Top de un Div

Estas en el tema de Problema funcion para alterar el Left y Top de un Div en el foro de Javascript en Foros del Web. Vereis, estoy haciendo algo con HTML CSS y JS para pasar el rato. Es simplemente un fondo negro con una Cara encima. Debajo cuatro botones. ...
  #1 (permalink)  
Antiguo 29/12/2010, 08:34
 
Fecha de Ingreso: noviembre-2010
Mensajes: 48
Antigüedad: 12 años, 2 meses
Puntos: 0
Problema funcion para alterar el Left y Top de un Div

Vereis, estoy haciendo algo con HTML CSS y JS para pasar el rato. Es simplemente un fondo negro con una Cara encima. Debajo cuatro botones. Cada botón mueve la carita hacia un lado. He hecho todo y cuando he ido a probar mi proyecto había algo que no funcionaba:
Solo cambia de posicion ( la carita) 2 veces. Además no se puede repetir 2 veces el mismo botón. Alguna solucion?
Os dejo el código para que veais los errores.
HTML:
Código:
<html>
<head>
<title>Troll Move</title>
<link rel="stylesheet" type="text/css" href="troll.css">
<script language="javascript" src="troll.js" type="text/javascript"></script>
</head>
<body>
<div class="tablero"></div>
<div id="troll"></div>
<div class="mando">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
</td>
<td><input type="button" value="o" onclick="arriba()">
</td>
<td>
</td>
</tr>
<tr>
<td><input type="button" value="o" onclick="izquierda()">
</td>
<td>
</td>
<td><input type="button" value="o" onclick="derecha()">
</td>
</tr>
<tr>
<td>
</td>
<td><input type="button" value="o" onclick="abajo()">
</td>
<td>
</td>
</tr>
</table>
</div>
</body>
</html>
CSS:
Código:
div.tablero{
background-color:black;
position:absolute;
top:0px;
left:0px;
visibility:visible;
z-index:1;
width:324px;
height:324px;
}

#troll{
background-image:url('trollface.JPG');
position:relative;
top:0px;
left:0px;
visibility:visible;
z-index:2;
width:54px;
height:54px;
}

div.mando{
position:relative;
visibility:visible;
z-index:3;
top:180px;
left:200px;
}
JS:
Código:
function arriba(){
var spencer=document.getElementById('troll')
spencer.style.top-='54px'
}

function izquierda(){
var spencer=document.getElementById('troll')
spencer.style.left-='54px'
}

function derecha(){
var spencer=document.getElementById('troll')
spencer.style.left+='54px'
}

function abajo(){
var spencer=document.getElementById('troll')
spencer.style.top+='54px'
}
Espero que me podais ayudar. Gracias de antemano

Etiquetas: alterar, funcion, left, top
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:15.