2017-01-28 2 views
-1

ここではコードの人です、私は最初のimgが最初の勝利よりも2番目に当たったらゲームを書いていますが、私はこのオブジェクトをSpaceで動かすことはできません。Spaceelickで私はすばやくX座標と、それは彼が他の勝利ブロックに当たった場合、それは国境に当たるかどうかは私はimgを左に動かしたいですが、スペースはコードの何が問題なのでしょうか?

<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 
<link rel="stylesheet" type="text/css" href="game.css"> 
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> 
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <title>Game</title> 
    </head> 
<body> 
<div class="cont"> 
<img id="img" src="untitled.png" width="30px"> 
<img id="img1" src="untitled.png" width="30px"> 
</div> 

<script type="text/javascript"> 
$(document).ready(function(){ 
var pus=$('.cont #img,#img1').draggable({containment: ".cont", axis:"y"}); 
}); 
var player=document.getElementById('.cont #img'); 
var playerLeft=0; 
function anim(e){ 
if(e.keyCode==32){ 
    left+=2; 
    player.style.left=playerLeft+'px'; 
} 
document.onkeypress=anim; 

} 
document.addEventListener('e', anim); 
</script> 
</body> 
</html> 

答えて

1

を失い、あなたのコード内で複数のエラーがあります...それをすべて読んでください、ラインごと - たとえば、あなたは

を使用
playerLeft = 0; 

プレイヤーの位置を保存するが、使用する

left += 2; 
player.style.left = playerLeft+'px'; 

もう一度プレーヤーを移動し、別の変数に2を加えます。

ただ、あなたにいくつかの "方向" を与えるために、ここを見て:

var player = document.getElementById('img'); 
 
player.style.position = 'relative'; 
 
var playerLeft=0; 
 
function anim(e){ 
 
if(e.keyCode==32){ 
 
    playerLeft+=2; 
 
    player.style.left=playerLeft+'px'; 
 
} 
 
} 
 
document.onkeydown = anim;
<div class="cont"> 
 
<img id="img" src="untitled.png" width="30px"> 
 
<img id="img1" src="untitled.png" width="30px"> 
 
</div>

関連する問題