js中控制物体无延迟移动的思路

莱恩-哈特

于 2017-05-23 20:23:32 发布

阅读量1.3k

点赞数

分类专栏：前端技术文章标签：移动 box js

本文链接：https://blog.csdn.net/wangongda/article/details/72661962

版权

前端技术专栏收录该内容

89 篇文章 0 订阅

订阅专栏

自由自动：

window.οnlοad=function(){
var box=document.getElementById("box");
//初始化状态
var left=false;
var top=false;
var right=false;
var down=false;
//状态1
document.οnkeydοwn=function(ev){
var e=ev||event;
var code=e.keyCode;
document.title=code;

switch(code){
case 37:left=true;break;
case 38:top=true;break;
case 39:right=true;break;
case 40:down=true;break;
}

}
//状态2
document.οnkeyup=function(ev){
var e=ev||event;
var code=e.keyCode;

switch(code){
case 37:left=false;break;
case 38:top=false;break;
case 39:right=false;break;
case 40:down=false;break;
}

}

var timer=setInterval(function(){
if(left){box.style.left=box.offsetLeft-10+'px';}
if(top){box.style.top=box.offsetTop-10+'px';}
if(right){box.style.left=box.offsetLeft+10+'px';}
if(down){box.style.top=box.offsetTop+10+'px';}
},50)
}