html5飞机发射教程,Javascript学习笔记（13_5） --js事件（飞机发射子弹）

飞机发射子弹

var imgs = document.getElementById("imgs"), oul = document.getElementById("oul"); document.onkeydown = function(e){ var e = window.event || e; switch(e.keyCode){ case 37: //左 imgs.style.left = imgs.offsetLeft - 10+"px"; break; case 38: //上 imgs.style.top = imgs.offsetTop - 10+"px"; break; case 39: //右 imgs.style.left = imgs.offsetLeft + 10+"px"; break; case 40: //下 imgs.style.top = imgs.offsetTop + 10+"px"; break; case 32: //空格 ---发射子弹 var oli = document.createElement("li"); oul.appendChild(oli); var left = imgs.offsetLeft + imgs.offsetWidth/2 ; var top = imgs.offsetTop ; run(oli,left,top); //子弹 发射方法 break; } } function run(dom,value1,value2){//子弹 发射方法 dom.style.left = value1+"px"; dom.style.top = value2+"px"; setInterval(function(){ if(dom.offsetTop-20 >= 0){ dom.style.top = dom.offsetTop-20+"px"; }else{ dom.style.top = 0; } console.log(dom.style.top) },300); }