[SOLUCIONADO] No funciona el codigo

icm9 · #1 (**permalink**) 15/09/2014, 13:36

Tengo un 'personaje' quiero q se mueva de acuerdo con lo que toque con las flechitas...

hice esto pero me dice que undefined is not a function.
[CODE] <body>
<div id="personaje"></div>
<span id="kc"></span><br/><span id="kcode"></span>
<script>
var intervalID;
var keyCode;
var personajeID = document.getElementById('personaje');
document.onkeydown=
function move(e){
var keyCode=e.keyCode;
switch (keyCode){
case 37:
//move left
document.getElementById('kc').innerHTML = 'izquierda';
document.getElementById("kcode").innerHTML=keyCode ;
intervalID=setInterval(repeat(keyCode),10);
break;
case 38:
//move top
document.getElementById('kc').innerHTML = 'arriba';
document.getElementById("kcode").innerHTML=keyCode ;
break;
case 39:
//move right
document.getElementById('kc').innerHTML = 'derecha';
document.getElementById("kcode").innerHTML=keyCode ;
break;
case 40:
//move down
document.getElementById('kc').innerHTML = 'abajo';
document.getElementById("kcode").innerHTML=keyCode ;
break;
default:
break;
}
};
function repeat(kc){
var actualLEFT = window.personajeID.left;
var actualRIGHT;
var actualTOP;
var actualBOTTOM;
switch(kc){
case 37:

personajeID.style.left=actualLEFT-1+'px';
}
}
</script>
</body>
</html>
/CODE]

este es el 'personaje'

Código CSS:

Ver original#personaje{
    background-image:url('images/face.png');
    position:absolute;
    width:50px;
    height:50px;
    border-radius:100%;
    background-size:50px 50px;
    left:50%;
    top:50%;
}

ayuda?

IsaBelM · #2 (**permalink**) 15/09/2014, 15:57

cambia lo que tienes por

document.onkeydown=function(e){
intervalID=setInterval(function(){repeat(keyCode)} ,10);
var actualLEFT =parseInt(window.getComputedStyle(personajeID, null)['left']);

ya con estos cambios el código ha ser funcional

icm9 · #3 (**permalink**) 15/09/2014, 20:20

muchas gracias