simple tank game where you k○ll enemies's game

Sure! Here's an example of a simple tank game where you can control a tank and kill enemies using JavaScript in an HTML file:

In this tank game, you can control the tank using the left and right arrow keys. Pressing the space bar shoots bullets from the tank. The objective is to shoot down the enemies that randomly appear on the screen. You earn 10 points for every enemy you eliminate. The game is enclosed in `
` tags and utilizes the `

` element with different CSS styles to represent the tank, bullets, and enemies. The `startGame()` function sets up the game environment, initializes the tank, handles user input, and continuously updates the positions of bullets and enemies. Please note that this is a basic example and can be enhanced further with additional features, graphics, and functionalities based on your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

Click here for free DL of the app version that can save data.

Sure! Here's an example of a simple tank game where you can control a tank and kill enemies using JavaScript in an HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tank Game</title>
  <style>
    #game-board {
      border: 1px solid black;
      width: 400px;
      height: 400px;
      position: relative;
    }
    #tank {
      width: 50px;
      height: 50px;
      position: absolute;
      bottom: 0;
      left: 0;
      background-color: blue;
    }
    .bullet {
      width: 10px;
      height: 10px;
      position: absolute;
      background-color: red;
    }
    .enemy {
      width: 30px;
      height: 30px;
      position: absolute;
      background-color: green;
    }
  </style>
</head>
<body onload="startGame()">
  <div id="game-board"></div>

tank = {
        x: 0,
        y: game.height - 50,
        width: 50,
        height: 50,
        render: function() {
          game.canvas.innerHTML += '<div id="tank" style="left:' + this.x + 'px; bottom:' + this.y + 'px;"></div>';
        }
      };

document.onkeydown = function(e) {
        switch (e.keyCode) {
          case 37: // left arrow key
            tank.x -= 10;
            break;
          case 39: // right arrow key
            tank.x += 10;
            break;
          case 32: // space key
            bullets.push(new Bullet(tank.x + tank.width / 2, tank.y));
            break;
        }
        game.render();
      };

setInterval(function() {
        bullets.forEach(function(bullet) {
          bullet.y -= 5;
        });
        bullets = bullets.filter(function(bullet) {
          return bullet.y > 0;
        });

if (Math.random() < 0.05) {
          enemies.push(new Enemy(Math.random() * (game.width - 30), 0));
        }

enemies.forEach(function(enemy) {
          enemy.y += 3;
        });
        enemies = enemies.filter(function(enemy) {
          return enemy.y < game.height;
        });

bullets.forEach(function(bullet) {
          enemies.forEach(function(enemy) {
            if (bullet.x >= enemy.x && bullet.x <= enemy.x + enemy.width && bullet.y <= enemy.y + enemy.width) {
              score += 10;
              bullets.splice(bullets.indexOf(bullet), 1);
              enemies.splice(enemies.indexOf(enemy), 1);
            }
          });
        });

game.render();
      }, 30);
    }

function Bullet(x, y) {
      this.x = x;
      this.y = y;

this.render = function() {
        game.canvas.innerHTML += '<div class="bullet" style="left:' + this.x + 'px; bottom:' + this.y + 'px;"></div>';
      };
    }

function Enemy(x, y) {
      this.x = x;
      this.y = y;
      this.width = 30;
      this.height = 30;

this.render = function() {
        game.canvas.innerHTML += '<div class="enemy" style="left:' + this.x + 'px; bottom:' + this.y + 'px;"></div>';
      };
    }
  </script>
</body>
</html>
```

The game is enclosed in `<script>` tags and utilizes the `<div>` element with different CSS styles to represent the tank, bullets, and enemies. The `startGame()` function sets up the game environment, initializes the tank, handles user input, and continuously updates the positions of bullets and enemies.

Please note that this is a basic example and can be enhanced further with additional features, graphics, and functionalities based on your requirements.