Este artículo es un artículo espejo de traducción automática, por favor haga clic aquí para saltar al artículo original.

Vista: 17480|Respuesta: 8

[JavaScript] Un pequeño juego hecho con JavaScript

[Copiar enlace]
Publicado en 7/11/2014 22:58:39 | | | |
Afirmación: La tecnología es un poco cutre, el dios no me hackea, no hice el procesamiento de botones, solo puedo actualizar la página cuando la cuelgo
       Aquí tienes el código: También puedes descargar el archivo adjunto directamente
  1. <html>
  2. <head>
  3.     <title></title>
  4.     <script type ="text/javascript">

  5.         //***********封装一个Tank类***
  6.         //当创建一个实例时在页面生成一个Tank
  7.         function Tank(x, y) {
  8.             this.x = x;
  9.             this.y = y;
  10.             this.shape = "~^~";
  11.             //****创建div到页面****
  12.             this.div = document.createElement("div");
  13.             this.div.style.position = "absolute";
  14.             this.div.style.width = "40px";
  15.             this.div.style.height = "40px";
  16.             this.div.style.lineHeight = "20px";
  17.             this.div.style.textAlign = "center";
  18.             this.div.style.backgroundColor = "red";
  19.             this.div.style.left = this.x + "px";
  20.             this.div.style.top = this.y + "px";
  21.             this.div.innerHTML = this.shape;
  22.             document.body.appendChild(this.div);
  23.             //*************************
  24.             this.move = function (left, top) {
  25.                 var h = window.innerHeight || document.documentElement.clientHeight;  // 浏览器内容窗口的高
  26.                 var w = document.documentElement.clientWidth;  // 宽
  27.                 this.x += left;
  28.                 this.y += top;
  29.                 if (this.x + 40 > w) {
  30.                     this.x = w - 40;
  31.                 }
  32.                 if (this.x < 0) {
  33.                     this.x = 0;
  34.                 }
  35.                 if (this.y + 40 > h) {
  36.                     this.y = h - 40;
  37.                 }
  38.                 if (this.y < 0) {
  39.                     this.y = 0;
  40.                 }
  41.                 this.div.style.left = this.x + "px";
  42.                 this.div.style.top = this.y + "px";
  43.             };
  44.             //消失的方法
  45.             this.die = function () {
  46.                 document.body.removeChild(this.div);
  47.             };
  48.         }

  49.         //****************创建*****
  50.         var arr = new Array();
  51.         var i = 0;
  52.         function createTank() {
  53.             var x = document.getElementById("xp").value;
  54.             var y = document.getElementById("yp").value;
  55.             arr[i] = new Tank(parseInt(x), parseInt(y));
  56.             startMove(i);   
  57.             i++;
  58.         }

  59.         var siArr = new Array();//记录下所有回调
  60.         function startMove(num) {
  61.                 //速度与方向**************************
  62.                 var xLen = Math.random() * 20;
  63.                 xLen = parseInt(xLen);  //5
  64.                 var yLen = Math.random() * 20;
  65.                 yLen = parseInt(yLen);  //5
  66.                 //************************
  67.                 siArr[num] = setInterval(function () {
  68.                     arr[num].move(xLen, yLen);
  69.                     if (mouseX >= arr[num].x && mouseX <= arr[num].x + 40 &&
  70.                         mouseY >= arr[num].y && mouseY <= arr[num].y + 40
  71.                     ) {

  72.                         for (var j = 0; j < siArr.length; j++) {
  73.                             clearInterval(siArr[j]);
  74.                         }
  75.                         clearInterval(si);
  76.                         alert("game over!");

  77.                     }

  78.                     var h = window.innerHeight || document.documentElement.clientHeight;  // 浏览器内容窗口的高
  79.                     var w = document.documentElement.clientWidth;  // 宽
  80.                     if (arr[num].x >= w - 40) {
  81.                         xLen = Math.abs(xLen) * (-1);
  82.                     }
  83.                     if (arr[num].x <= 0) {
  84.                         xLen = Math.abs(xLen);
  85.                     }
  86.                     if (arr[num].y >= h - 40) {
  87.                         yLen = Math.abs(yLen) * (-1);
  88.                     }
  89.                     if (arr[num].y <= 0) {
  90.                         yLen = Math.abs(yLen);
  91.                     }
  92.                 }, 10);
  93.         }


  94.         var mouseX = 0;
  95.         var mouseY = 0;
  96.         document.onmousemove = function (e) {
  97.             var ev = e || event;
  98.             mouseX =parseInt( ev.clientX);
  99.             mouseY =parseInt( ev.clientY);
  100.             document.title = "x:" + mouseX + " y:" + mouseY;
  101.         }

  102.         //*********************开始游戏
  103.         var si = null;
  104.         function startGame(v) {
  105.             i = 0;
  106.             v.disabled = true;
  107.             var time = 0;
  108.             si = setInterval(function () {
  109.                 time++;
  110.                 v.value = "时间:" + time + "秒";
  111.             }, 1000);
  112.             var n=document.getElementById("lev").value;
  113.             n=parseInt(n);
  114.             for ( ; i < n; i++) {
  115.                 arr[i] = new Tank(200, 200);
  116.                 startMove(i);
  117.             }
  118.         }
  119.     </script>
  120. </head>
  121. <body >
  122. <center>
  123. <br />看你能玩多久!!
  124. 难度:<input  type ="text" value ="10" id="lev" />
  125. <input type ="button" value="开始" onclick="startGame(this)" />
Copiar código




Tank.zip

1,48 KB, Tiempos de descarga: 13, Créditos de descarga: -1 prestigio, -1 contribución





Anterior:llamadas en C# RunDll32.exe limpiar la caché del navegador y la basura
Próximo:¡Enviad a algunos miembros de los Thunder!
Publicado en 7/11/2014 23:17:26 |
Aun así descargo el archivo adjunto y se me olvida, el juego es bastante difícil de jugar, te sugiero que ajustes la dificultad a 1  
 Propietario| Publicado en 7/11/2014 23:20:14 |
admin publicado el 7-11-2014 a las 23:17
Aun así descargo el archivo adjunto y se me olvida, el juego es bastante difícil de jugar, te sugiero que ajustes la dificultad a 1

Cambia el código fuente y ajusta la hora
Publicado en 13/11/2014 20:09:28 |


¿Supongo que he puesto el ratón ahí?
Publicado en 13/11/2014 21:15:56 |
¿Qué juego? Cómo jugar a Gameover desde el principio
 Propietario| Publicado en 14/11/2014 22:21:24 |
Beicheng tejido temperatura 22 grados Publicado el 13-11-2014 21:15
¿Qué juego? Cómo jugar a Gameover desde el principio

El ratón no puede ser golpeado por un tanque en movimiento y se queda suspendido en cuanto es alcanzado
 Propietario| Publicado en 14/11/2014 22:22:10 |
admin publicado el 2014-11-13 20:09
¿Supongo que he puesto el ratón ahí?

Qué mirada tan poderosa
Publicado en 14/11/2014 22:22:51 |

En realidad, utilicé elementos de censura
 Propietario| Publicado en 14/11/2014 22:23:50 |
admin publicado el 2014-11-14 a las 22:22
En realidad, utilicé elementos de censura

El F12 polivalente  
Renuncia:
Todo el software, materiales de programación o artículos publicados por Code Farmer Network son únicamente para fines de aprendizaje e investigación; El contenido anterior no se utilizará con fines comerciales o ilegales; de lo contrario, los usuarios asumirán todas las consecuencias. La información de este sitio proviene de Internet, y las disputas de derechos de autor no tienen nada que ver con este sitio. Debes eliminar completamente el contenido anterior de tu ordenador en un plazo de 24 horas desde la descarga. Si te gusta el programa, por favor apoya el software genuino, compra el registro y obtén mejores servicios genuinos. Si hay alguna infracción, por favor contáctanos por correo electrónico.

Mail To:help@itsvse.com