首页 > 代码库 > Day9--------freeRemove
Day9--------freeRemove
//------------存放四个变量控制四个方向,可以进行斜向位移
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>freeRemove</title> 6 </head> 7 <style type="text/css"> 8 #tank{width: 100px;height: 100px;position: absolute;background: red;} 9 </style>10 <script type="text/javascript">11 window.onload=function(){12 var timer=["up","down","left","right"]; 13 var keyId;14 oTank=document.getElementById(‘tank‘);15 function clear(){16 clearInterval(timer[keyId]);17 }18 document.onkeydown=function(ev){19 oEvent=ev||event; 20 switch(oEvent.keyCode){21 case 37:clearInterval(timer[0]);timer[0]=setInterval(function(){oTank.style.left=oTank.offsetLeft-5+‘px‘;},10);break;22 case 38:clearInterval(timer[1]);timer[1]=setInterval(function(){oTank.style.top=oTank.offsetTop-5+‘px‘;},10);break;23 case 39:clearInterval(timer[2]);timer[2]=setInterval(function(){oTank.style.left=oTank.offsetLeft+5+‘px‘;},10);break;24 case 40:clearInterval(timer[3]);timer[3]=setInterval(function(){oTank.style.top=oTank.offsetTop+5+‘px‘;},10);break;25 } 26 }27 document.onkeyup=function(ev){28 oEvent=ev||event;29 keyId=oEvent.keyCode-37;30 switch(oEvent.keyCode){31 case 37:clear();break;32 case 38:clear();break;33 case 39:clear();break;34 case 40:clear();break;35 default: break;36 }37 }38 }39 </script>40 <body>41 <div id="tank"></div>42 </body>43 </html>
Day9--------freeRemove
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。