onkeydown事件

<img src="images/hot.jpg" alt="" id="imgId" class="img1"/>
</body>
<script>
var imgObj=document.getElementById("imgId");
var xs=0;
var xv=10;
var ys=0;
var yv=30;
document.onkeydown=function(event){ //实现图片的移动
kc=event.keyCode;
console.log(kc);
switch(kc){
case 37:
xs-=xv;imgObj.style.left=xs+"px";
document.body.style.background="#567";
break;
case 38:ys-=yv;imgObj.style.top=ys+"px";break;
case 39:xs+=xv;imgObj.style.left=xs+"px";break;
case 40:ys+=yv;imgObj.style.top=ys+"px";break;
}
}
</script>
posted @ 2017-09-09 17:38  wanan_01  阅读(268)  评论(0编辑  收藏  举报