Learning a while of JavaScript, should do something, although the thing is still a patchwork, laughed. Direction key control tank move, enter a bomb. Other features of enemy tanks that haven't been written yet.
<ptml> <pead> <meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/> <title>javascript Tank Game Preliminary | Nancy practice works </title> <style type=" Text/css "> body{Background:black; } #tanke {Position:absolute; left:500px; top:200px; } </style> </pead> <body> <div id= "Tanke" ></div> </body> </ptml> <script language= "JavaScript" type= "Text/javascript" > var i = 0; var bombleftarray = new Array (100);//store bomb information x var bombtoparray = new Array (100);//Store bomb info y var bombdirct Ionarray = new Array (100);//store bomb direction var t = new Array (100);//Bomb acceleration for (var t_ = 0;t_ < 100;t_++) {T[t_] = 0; var bombsetup = 3;//bomb speed var client_width = document.body.clientWidth +document.body.scrollleft;//page width var client_height = document.body.clientHeight + document.body.scrolltop;//height of page function $ (obj) {return document.getElementById (obj); }//Page All bombs move function Runallbomb () {var allbomb = document.getElementsByTagName ( "Div"); for (var j_ = 1;j_ < Allbomb.length;j_ + +) {//judge the direction of the bullet if (bombdirctionarray[j_] = = null) {var reg =/[a-z]{1,}\.gif/;//Match If you find the name of the picture. 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_]-bombse Tup*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 = Bo Mbtoparray[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 = Bombleftarra Y[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); Get all the bombs on the page and let it run at a certain speed Document.onkeydown = function (evt) {VA R evt = window.event?window.event:evt;//Gets the compatible spelling of the event object, compatible with FF and IE var tanke_w = $ ("Tanke"). offsetwidth;//get the width of the tank degree var Tanke_h = $ ("Tanke"). offsetheight;//gets the height of the tank var current_x = $ ("Tanke"). offsetleft;//tank current x sit Superscript var current_y = $ ("Tanke"). offsettop;//tank current y-coordinate var step = 2;//Moving speed var z_step = 1;//Bullet Speed Switch (evt.kEycode) {//Left case: $ ("Tanke"). Style.left = Curren t_x + document.body.scrollleft-step + "px"; $ ("Tanke"). InnerHTML = ""; Break Case to right: $ ("Tanke"). Style.left = current_x + document.body.scrollLeft + step + "px" ; $ ("Tanke"). InnerHTML = ""; Break Up case: $ ("Tanke"). InnerHTML = ""; $ ("Tanke"). Style.top = current_y + document.body.scrolltop-step + "px"; Break Down Case: $ ("Tanke"). InnerHTML = ""; $ ("Tanke"). Style.top = current_y + document.body.scrollTop + step + "px"; Break Issue attack case 13: New bullets 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/;//Match If you find the name of the picture, var current_decoration = $ ("Tanke"). Innerhtml.match (REG) ; Switch (current_decoration[0])//press ENTER to send the bomb {//barrel to the left CA Se "left.gif": CreateDiv.style.left = current_x-5 + "px"; CreateDiv.style.top = current_y + (TANKE_H/2)-3 + "px"; creatediv.innerhtml = "" Break; The barrel to the right 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 The barrel against the top case "top.gif": CreateDiv.style.left = current_x + (TANKE_W/2) -5 + "px"; CreateDiv.style.top = current_y-5 + "px"; creatediv.innerhtml = ""; Break The barrel to the bottom of the 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 All SELECT Note: If the need to introduce external JS need to refresh to perform]
