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

No:7865

148

←

Prev Next

→

Shooting Game
Developer User4088｜Date and time 23/7/10 2:38:51
Build time 17.447 sec｜Game capacity 4.736KB｜

Script

Sure! Here's a basic example of a shooting game implemented as a single HTML file using JavaScript:

Shooting Game

This code creates a simple shooting game where you control a blue player at the bottom of the screen and shoot bullets by pressing the spacebar. The objective is to shoot the green enemies falling from the top before they reach the player. If an enemy collides with the player, the game ends. You can copy this code into a new HTML file, save it, and open it in a web browser to play the game.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a basic example of a shooting game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Shooting Game</title>
  <style>
    #game {
      width: 400px;
      height: 400px;
      border: 1px solid black;
      position: relative;
    }

#player {
      width: 50px;
      height: 50px;
      background-color: blue;
      position: absolute;
      bottom: 0;
      left: 175px;
    }

.bullet {
      width: 10px;
      height: 10px;
      background-color: red;
      position: absolute;
    }

.enemy {
      width: 50px;
      height: 50px;
      background-color: green;
      position: absolute;
    }
  </style>
</head>
<body>
  <h1>Shooting Game</h1>
  <div id="game">
    <div id="player"></div>
  </div>

// Player settings
    let player = document.getElementById('player');
    let playerX = (GAME_WIDTH - PLAYER_WIDTH) / 2;

// Bullet settings
    let bullets = [];
    const BULLET_SPEED = 5;

// Enemy settings
    let enemies = [];
    const ENEMY_SPEED = 2;
    const ENEMY_SPAWN_INTERVAL = 1000;
    let enemySpawnIntervalId = null;

// Game loop
    function gameLoop() {
      update();
      render();
    }

// Update game state
    function update() {
      // Update player
      player.style.left = playerX + 'px';

// Update bullets
      bullets.forEach(bullet => {
        bullet.y -= BULLET_SPEED;
        bullet.style.top = bullet.y + 'px';
      });

// Update enemies
      enemies.forEach(enemy => {
        enemy.y += ENEMY_SPEED;
        enemy.style.top = enemy.y + 'px';

// Check collision between enemy and bullets
        bullets.forEach(bullet => {
          if (checkCollision(enemy, bullet)) {
            enemy.remove();
            bullet.remove();
          }
        });

// Check collision between enemy and player
        if (checkCollision(enemy, player)) {
          endGame();
        }
      });
    }

// Render game elements
    function render() {
      bullets.forEach(bullet => document.getElementById('game').appendChild(bullet));
      enemies.forEach(enemy => document.getElementById('game').appendChild(enemy));
    }

// Check collision between two elements
    function checkCollision(element1, element2) {
      let rect1 = element1.getBoundingClientRect();
      let rect2 = element2.getBoundingClientRect();

return (
        rect1.left < rect2.right &&
        rect1.right > rect2.left &&
        rect1.top < rect2.bottom &&
        rect1.bottom > rect2.top
      );
    }

// Handle player movement
    document.addEventListener('keydown', function(event) {
      if (event.key === 'ArrowLeft' && playerX > 0) {
        playerX -= 10;
      } else if (event.key === 'ArrowRight' && playerX < GAME_WIDTH - PLAYER_WIDTH) {
        playerX += 10;
      } else if (event.key === ' ') {
        // Fire bullet
        let bullet = document.createElement('div');
        bullet.className = 'bullet';
        bullet.style.top = (GAME_HEIGHT - PLAYER_HEIGHT) + 'px';
        bullet.style.left = (playerX + (PLAYER_WIDTH / 2)) + 'px';
        bullet.y = GAME_HEIGHT - PLAYER_HEIGHT;
        bullets.push(bullet);
      }
    });

// Start game
    function startGame() {
      enemySpawnIntervalId = setInterval(spawnEnemy, ENEMY_SPAWN_INTERVAL);
      gameLoop();
    }

// End game
    function endGame() {
      clearInterval(enemySpawnIntervalId);
      alert('Game Over!');
      resetGame();
    }

// Reset game
    function resetGame() {
      playerX = (GAME_WIDTH - PLAYER_WIDTH) / 2;
      bullets = [];
      enemies = [];
      document.querySelectorAll('.bullet').forEach(bullet => bullet.remove());
      document.querySelectorAll('.enemy').forEach(enemy => enemy.remove());
    }

// Spawn enemy
    function spawnEnemy() {
      let enemy = document.createElement('div');
      enemy.className = 'enemy';
      enemy.style.top = '0px';
      enemy.style.left = Math.floor(Math.random() * (GAME_WIDTH - PLAYER_WIDTH)) + 'px';
      enemy.y = 0;
      enemies.push(enemy);
    }

// Start the game
    startGame();
  </script>
</body>
</html>
```

You can copy this code into a new HTML file, save it, and open it in a web browser to play the game.