Question

我的keyPress运动似乎被打破，如果我按两次arr.up / down然后它会被打破，我无法将元素移回。当我停止按住arr.up / down时，元素甚至不会停止，为什么？

rocket = new Image();
x = 50;
y = 185;
score = 0;
velY = 0;
speed = 2;

y += velY;
ctx.drawImage(rocket, x, y);

    if(e.keyCode == 38) {
    if(velY < speed) {
        velY --;
    }
}

if(e.keyCode == 40) {
    if(velY < speed) {
        velY ++;
    }
}

预览：http://game.stranger.tk/

Answer 1

我会编辑你的代码，但你的游戏通过你的链接工作:(。我希望我提供的代码示例可以帮助你。

jsFiddle：https://jsfiddle.net/w1z2c1cq/

的javascript

var c = document.getElementById('myCanvas');
var ctx = c.getContext('2d');

var rocket = function()
{
    this.Sprite = new Image();
  this.Sprite.src = "https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcS9zafp1ezdR2lSAxTdjZYe_nPhe6VeKKmAuK-GzWQCSs395WkzNA";
    this.XPos = 100;
  this.YPos = 100;
}

var player = new rocket();

setInterval(function()
{
    ctx.fillRect(0,0,400,400);
    ctx.drawImage(player.Sprite, player.XPos, player.YPos);
}, 3);


window.addEventListener("keydown", function(e){
        // Left key
    if(e.keyCode === 37) {
        player.XPos -= 5;
    }
    // Right key
    if(e.keyCode === 39) {
        player.XPos += 5;
    }
    // Up key
    if(e.keyCode === 38) {
        player.YPos -= 5;
    }
    // Down key
    if(e.keyCode === 40) {
        player.YPos += 5;
    }
});

同样在您的代码中，您正在检查上下if(velY < speed)

的相同if语句

试

// Up
if(e.keyCode == 38) {
    if(velY < speed) {
        velY --;
    }
}

// Down
if(e.keyCode == 40) {
    if(velY > -speed) {
        velY ++;
    }
}

canvas keyPress运动 - 破碎

1 个答案: