Top down shooter, you have a gun that fires bullets, you can shoot and k○ll zombies that spawn randomly, zombies k○ll you if they touch you. You have 3 lives's game

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

No:50603

←

Prev Next

→

Top down shooter, you have a gun that fires bullet..ALL
Developer User21371｜Date and time 24/3/9 8:30:25
Build time 11.932 sec｜Game capacity 4.148KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

```
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Zombie Shooter Game</title>
<style>
    body {
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        background-color: #000;
    }

canvas {
        border: 2px solid #fff;
    }
</style>
</head>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script>
    const canvas = document.getElementById('gameCanvas');
    const ctx = canvas.getContext('2d');

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

const bullet = {
        x: player.x,
        y: player.y,
        radius: 5,
        speed: 5,
        isFired: false
    };

let zombies = [];
    let score = 0;

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

function fireBullet() {
        bullet.isFired = true;
        bullet.x = player.x + player.width / 2;
        bullet.y = player.y;
    }

function updateBullet() {
        if(bullet.isFired) {
            bullet.y -= bullet.speed;
            if(bullet.y < 0) {
                bullet.isFired = false;
            }
        }
    }

function checkCollision() {
        zombies.forEach((zombie, zombieIndex) => {
            if(zombie.x < player.x + player.width &&
               zombie.x + zombie.width > player.x &&
               zombie.y < player.y + player.height &&
               zombie.y + zombie.height > player.y) {
                player.lives--;
                zombies.splice(zombieIndex, 1);
            }

if(bullet.isFired && bullet.x < zombie.x + zombie.width &&
               bullet.x + bullet.radius > zombie.x &&
               bullet.y < zombie.y + zombie.height &&
               bullet.y + bullet.radius > zombie.y) {
                zombies.splice(zombieIndex, 1);
                bullet.isFired = false;
                score++;
            }
        });
    }

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        drawPlayer();
        drawBullet();
        drawZombies();

ctx.font = '20px Arial';
        ctx.fillStyle = '#fff';
        ctx.fillText(`Lives: ${player.lives}`, 10, 30);
        ctx.fillText(`Score: ${score}`, 10, 60);

if(player.lives <= 0) {
            alert('Game Over! Your final score is: ' + score);
            document.location.reload();
        }

if(zombies.length === 0) {
            zombies.push({
                x: Math.random() * (canvas.width - 50),
                y: 0,
                width: 50,
                height: 50
            });
        }

updateZombies();
        updateBullet();
        checkCollision();

requestAnimationFrame(draw);
    }

draw();
</script>
</body>
</html>
```