Make a 3D game you where you must fight against zombies's game

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

No:52682

175

←

Prev Next

→

Make a 3D game you where you must fight against zo..ALL
Developer User22109｜Date and time 24/3/24 2:40:27
Build time 11.232 sec｜Game capacity 1.943KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<DOCTYPE html>
<html>
  <head>
    <title>Zombie Fight</title>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    <script>
      const canvas = document.getElementById('gameCanvas');
      const ctx = canvas.getContext('2d');

let player = {
        x: canvas.width / 2,
        y: canvas.height - 50,
        width: 50,
        height: 50,
        speed: 5
      };

let zombies = [];

function createZombie() {
        const zombie = {
          x: Math.random() * canvas.width,
          y: 0,
          width: 50,
          height: 50,
          speed: Math.random() * 3 + 1
        };
        zombies.push(zombie);
      }

function drawPlayer() {
        ctx.fillStyle = 'blue';
        ctx.fillRect(player.x, player.y, player.width, player.height);
      }

function drawZombies() {
        ctx.fillStyle = 'green';
        zombies.forEach(zombie => {
          ctx.fillRect(zombie.x, zombie.y, zombie.width, zombie.height);
        });
      }

function updateGame() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();

zombies.forEach(zombie => {
          zombie.y += zombie.speed;

if (zombie.y > canvas.height) {
            zombies.splice(zombies.indexOf(zombie), 1);
          }
        });

drawZombies();
      }

function movePlayer(event) {
        if (event.key === 'ArrowLeft' && player.x > 0) {
          player.x -= player.speed;
        } else if (event.key === 'ArrowRight' && player.x + player.width < canvas.width) {
          player.x += player.speed;
        }
      }

function gameLoop() {
        createZombie();
        updateGame();
        requestAnimationFrame(gameLoop);
      }

document.addEventListener('keydown', movePlayer);

gameLoop();
    </script>
  </body>
</html>