zoukankan      html  css  js  c++  java
  • Javascript 坦克大战

    <!DOCTYPE html>
    <html onkeydown="run(event)">
    <head>
     <meta charset="utf-8">
     <title></title>
     <style type="text/css">
      #main{
       300px;height:300px;
       border:1px solid blue;
      }
      #tank{
       50px;height:50px;
       border:1px solid red;
      }
     </style>
    </head>
    <body>
     
     <div id="main"><div id="tank" style="margin-top:0px;margin-left:0px;"></div></div>
     <script type="text/javascript">
      
      var tank=document.getElementById("tank");
      var zd=[];
      
      function run(e){
       //按下了哪个键
       //alert(e.keyCode);
       switch(e.keyCode){
        case 37:
         left();
         break;
        case 38:
         up();
         break;
        case 39:
         right();
         break;
        case 40:
         down();
         break;
        case 32:
         fire();
         break;
        default:
         break;
       }
      }
      
      function up(){
       tank.style.marginTop=parseInt(tank.style.marginTop)-20+"px";
      }
      
      function down(){
       tank.style.marginTop=parseInt(tank.style.marginTop)+20+"px";
       
      }
      function left(){
       tank.style.marginLeft=parseInt(tank.style.marginLeft)-20+"px";
       
      }
      function right(){
       tank.style.marginLeft=parseInt(tank.style.marginLeft)+20+"px";
       
      }
      
      function fire(){
       //制造炮弹
       var obj=document.createElement("div");
       obj.style.width="10px";
       obj.style.height="10px";
       obj.style.backgroundColor="red";
       obj.style.position="absolute";
       obj.style.top=tank.style.marginTop;
       obj.style.left= parseInt(tank.style.marginLeft) +25 +"px" ;
       
       main.appendChild(obj);//将子弹加入到tank中
       
       zd[zd.length]=obj;
       
      }
      
      //检测,让所有的子弹飞!!
      setInterval(function(){   
       for(var i in zd){    
        zd[i].style.top=parseInt(zd[i].style.top) -5 +"px";
       }   
      },50);
     
     </script>
     
    </body>
    </html>

  • 相关阅读:
    WinFrom 第三方控件 TeleRik控件
    部署项目可以将源码删掉
    XDocument简单入门
    通过HttpWebRequest在后台对WebService进行调用
    C#中HttpWebRequest的用法详解
    HttpWebRequest类
    系统之间通讯方式—SOAP(web service)
    Linux strace命令
    使用 Linux 的 strace 命令跟踪/调试程序的常用选项
    Linux umount的device is busy问题
  • 原文地址:https://www.cnblogs.com/wicub/p/3119561.html
Copyright © 2011-2022 走看看