javascript 制作坦克大战游戏初步图片与代码分享-计算机技术网

—-想了解更多的linux相关异常处理怎么解决关注<计算机技术网(www.ctvol.com)!!> 学了一阵子的javascript，该做点东西，虽然东西还是东拼西凑，见笑。方向键控制坦克移动，回车键发射炸弹。其他的功能敌方坦克那些还没写。

<html>      <head>          <meta http-equiv="Content-Type" content="text/html; charset=GB2312" />          <title>javascript坦克游戏初步|阿会楠练习作品</title>          </p>
<style type="text/css">          body{              background:black;          }          #tanke{              position:absolute;              left:500px;              top:200px;          }          </style>
<p>                </head>      <body>              </p>
<div></div>
<p>      </body>  </html>  <script language="JavaScript" type="text/javascript">          var i = 0;          var bombLeftArray = new Array(100);//存放炸弹信息x          var bombTopArray = new Array(100);//存放炸弹信息y          var bombDirctionArray = new Array(100);//存放炸弹方向          var t = new Array(100);//炸弹加速度          for(var t_ = 0;t_ < 100;t_++)          {              t[t_] = 0;          }          var bombsetup = 3;//炸弹速度          var client_width = document.body.clientWidth + document.body.scrollLeft;//页面的宽度          var client_height = document.body.clientHeight + document.body.scrollTop;//页面的高度                    function $(obj){              return document.getElementById(obj);          }                    //页面所有炸弹的移动          function runAllBomb(){              var allBomb = document.getElementsByTagName("div");              for(var j_ = 1;j_ < allBomb.length;j_ ++)              {                                    //判断子弹的方向                  if(bombDirctionArray[j_] == null)                  {                          var reg = /[a-z]{1,}.gif/;//匹配只要找到图片的免费精选名字大全就可以了                      bombDirctionArray[j_] = allBomb[j_].innerHTML.match(reg) + "";                  }                                    switch(bombDirctionArray[j_])                  {                                            case "ztop.gif":                          bombLeftArray[j_] = allBomb[j_].offsetLeft;                          bombTopArray[j_] = allBomb[j_].offsetTop;                          if(bombTopArray[j_] > 0){                              allBomb[j_].style.top = bombTopArray[j_]  - bombsetup*t[j_];                              t[j_] ++;                                                        }                          else                          {                              allBomb[j_].style.display = "none";                          }                      break;                                            case "zbottom.gif":                          bombLeftArray[j_] = allBomb[j_].offsetLeft;                          bombTopArray[j_] = allBomb[j_].offsetTop;                                                    if(bombTopArray[j_] < client_height)                          {                              allBomb[j_].style.top = bombTopArray[j_] + bombsetup*t[j_];                              t[j_] ++;                          }                          else                          {                              allBomb[j_].style.display = "none";                          }                      break;                                            case "zleft.gif":                          bombLeftArray[j_] = allBomb[j_].offsetLeft;                          bombTopArray[j_] = allBomb[j_].offsetTop;                                                    if(bombLeftArray[j_] > 0)                          {                              allBomb[j_].style.left = bombLeftArray[j_] - bombsetup*t[j_];                              t[j_] ++;                          }                          else                          {                              allBomb[j_].style.display = "none";                          }                      break;                                            case "zright.gif":                          bombLeftArray[j_] = allBomb[j_].offsetLeft;                          bombTopArray[j_] = allBomb[j_].offsetTop;                                                    if(bombLeftArray[j_] < client_width)                          {                              allBomb[j_].style.left = bombLeftArray[j_] + bombsetup*t[j_];                              t[j_] ++;                          }                          else                          {                              allBomb[j_].style.display = "none";                          }                      break;                  }                                }              }          var runBomb = window.setInterval(runAllBomb,100);          //取得页面上所有的炸弹，并让其以一定速度运行                    document.onkeydown = function(evt){                                          var evt = window.event?window.event:evt;//获取event对象的兼容写法，兼容FF和IE               var tanke_w = $("tanke").offsetWidth;//取得坦克的宽度              var tanke_h = $("tanke").offsetHeight;//取得坦克的高度              var current_x = $("tanke").offsetLeft;//坦克当前x坐标              var current_y = $("tanke").offsetTop;//坦克当前y坐标              var step = 2;//移动的速度              var z_step = 1;//子弹速度              switch(evt.keyCode)              {                      //向左                  case 37:                  $("tanke").style.left = current_x + document.body.scrollLeft - step + "px";                  $("tanke").innerHTML = "";                  break;                                    //向右                  case 39:                  $("tanke").style.left = current_x + document.body.scrollLeft + step + "px";                  $("tanke").innerHTML = "";                  break;                                    //向上                  case 38:                  $("tanke").innerHTML = "";                  $("tanke").style.top = current_y + document.body.scrollTop - step + "px";                  break;                                    //向下                  case 40:                  $("tanke").innerHTML = "";                  $("tanke").style.top = current_y + document.body.scrollTop + step + "px";                  break;                                    //发出攻击                  case 13:                      //新子弹                      var createDiv = document.createElement("div");                      createDiv.setAttribute("id","bomb" + i);                      i ++;                      //createDiv.style.overflow = "hidden";                      createDiv.style.position = "absolute";                      var reg = /[a-z]{1,}.gif/;//匹配只要找到图片的免费精选名字大全就可以了                      var current_decoration = $("tanke").innerHTML.match(reg);                       switch(current_decoration[0])//按下回车发弹                      {                          //炮筒对着左边                          case "left.gif":                          createDiv.style.left = current_x - 5 + "px";                          createDiv.style.top = current_y + (tanke_h/2) - 3 + "px";                          createDiv.innerHTML = ""                          break;                                                    //炮筒对着右边                          case "right.gif":                          createDiv.style.left = current_x + tanke_w - 7 + "px";                          createDiv.style.top = current_y + (tanke_h/2) - 1 + "px";                          createDiv.innerHTML = "";                          break;                                                    //炮筒对着上边                          case "top.gif":                          createDiv.style.left = current_x + (tanke_w/2) - 5 + "px";                          createDiv.style.top = current_y - 5 + "px";                          createDiv.innerHTML = "";                          break;                                                    //炮筒对着下边                          case "bottom.gif":                          createDiv.style.left = current_x + (tanke_w/2) - 7 + "px";                          createDiv.style.top = current_y + tanke_h - 7 + "px";                          createDiv.innerHTML = "";                          break;                       }                       document.body.appendChild(createDiv);                  break;                                }                        }                          </script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址：https://www.ctvol.com/jspttutorial/70673.html

javascript 制作坦克大战游戏初步 图片与代码分享

精彩推荐

javascript 制作坦克大战游戏初步图片与代码分享