2016-03-22 21 views
1

benim dosyası:JavaScript HTML acces (nesneyi hareket sol-sağ) olamaz

index.html 
client 
    css 
    style.css 
    js 
    javascript.js 

index.html:

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"/> 
<title>blablabla</title> 
<link rel="stylesheet" type="text/css" href="client/css/style.css"> 
<script type="text/javascript" src="client/js/javascript.js"></script> 

</head> 
<body> 
<div id="container"> 
    <div id="guy"></div> 
</div> 

</body> 
</html> 

javascript.js

var guy=document.getElementById('guy'); 
var container=document.getElementById('container'); 

var guyLeft=0; 

function anim(e){ 
if(e.keyCode==39){ 
    guyLeft +=2; 
    guy.style.left = guyLeft + 'px'; 

} 
if(e.keyCode==37){ 
    guyLeft -=2; 
    guy.style.left = guyLeft + 'px'; 
} 
} 
document.onkeydown =anim; 

stili. css

#container{ 
height:400px; 
width:600px; 
outline:1px solid black; 
position: relative; 
} 
#guy{ 
position: absolute; 
height:50px; 
width:50px; 
outline:1px solid black; 
background-color:red; 
left:0; 
} 

1) öylesine çocuklar pls yardım .. Ben sadece sol ve sağ nesneyi taşımak istiyorum .. bu kodu bettwen index.html içinde koyarken çalışır ama ayrı javascript.js sınıfı çalışmıyor .. pls help .. 2) nesneyi yukarı ve aşağı taşımak için kod eklemek için .. pls benim sınıf için 1,2 ile yardımcı olur ..

+0

Kodunuz mükemmel çalışıyor. http://codepen.io/DanielTate/pen/RaVaLQ Javascript'inizin, kapama gövdesi etiketinin hemen önündeki belgeden sonra yüklendiğinden emin olun. –

+0

ty :))))))))))) –

+0

Sen .. şimdi çalışıyor Francesco'nın cevabı –

cevap

2

1) JavaScript'i sayfanın altına yüklemeniz gerekmektedir.

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8"/> 
     <title>blablabla</title> 
     <link rel="stylesheet" type="text/css" href="client/css/style.css"> 
    </head> 
    <body> 
     <div id="container"> 
      <div id="guy"></div> 
     </div> 
     <script type="text/javascript" src="client/js/javascript.js"></script> 
    </body> 
</html> 

2) aşağı yukarı hareket ettirin ve: Eğer JavaScript hataları ve hataları yakalamak istiyorsanız

var guy = document.getElementById('guy'); 
var container = document.getElementById('container'); 

var guyLeft = 0; 
var guyTop = 0; 

function anim(e){ 
    if(e.keyCode==39){ 
     guyLeft +=2; 
     guy.style.left = guyLeft + 'px'; 

    } 
    if(e.keyCode==37){ 
     guyLeft -=2; 
     guy.style.left = guyLeft + 'px'; 
    } 

    // UP 
    if(e.keyCode==38) { 
     guyTop -=2; 
     guy.style.top = guyTop + 'px'; 
    } 

    // DOWN 
    if(e.keyCode==40) { 
     guyTop +=2; 
     guy.style.top = guyTop + 'px'; 
    } 
} 

document.onkeydown = anim; 

Sen console kullanmalıdır.

+0

thx kabul burada yeni RokoC.Buljan hej darılmak yok im @ konsol ucu için JavaScript thx üzerinde ^^ –

+0

üzgün im yeni im gerekir yığının üstüne taşma .. şimdi iyiyim ben iyiyim cevabınız için .. barış :) –