Platformer zombie game's game

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

No:52037

2452

←

Prev Next

→

Platformer zombie game
Developer anonymous｜Date and time 24/3/17 11:14:54
Build time unknown sec｜Game capacity 2.25KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Zombie Platformer Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="400"></canvas>
    
    <script>
        const canvas = document.getElementById('gameCanvas');
        const ctx = canvas.getContext('2d');
        
        let playerX = 50;
        let playerY = 300;
        let playerWidth = 50;
        let playerHeight = 50;
        let playerSpeed = 5;
        
        let ZombieX = 700;
        let ZombieY = 300;
        let ZombieWidth = 50;
        let ZombieHeight = 50;
        let ZombieSpeed = 3;
        
        document.addEventListener('keydown', (event) => {
            if (event.key === 'ArrowRight' && playerX < canvas.width - playerWidth) {
                playerX += playerSpeed;
            } else if (event.key === 'ArrowLeft' && playerX > 0) {
                playerX -= playerSpeed;
            } else if (event.key === 'ArrowUp' && playerY > 0) {
                playerY -= playerSpeed;
            } else if (event.key === 'ArrowDown' && playerY < canvas.height - playerHeight) {
                playerY += playerSpeed;
            }
        });
        
        function update() {
            ZombieX -= ZombieSpeed;
            
            if (ZombieX < 0) {
                ZombieX = canvas.width;
            }
            
            if (playerX < ZombieX + ZombieWidth && 
                playerX + playerWidth > ZombieX && 
                playerY < ZombieY + ZombieHeight && 
                playerY + playerHeight > ZombieY) {
                alert('Game Over! You got caught by the Zombie.');
                document.location.reload();
            }
        }
        
        function draw() {
            ctx.fillStyle = 'black';
            ctx.fillRect(0, 0, canvas.width, canvas.height);
            
            ctx.fillStyle = 'green';
            ctx.fillRect(playerX, playerY, playerWidth, playerHeight);
            
            ctx.fillStyle = 'red';
            ctx.fillRect(ZombieX, ZombieY, ZombieWidth, ZombieHeight);
        }
        
        function gameLoop() {
            update();
            draw();
            requestAnimationFrame(gameLoop);
        }
        
        gameLoop();
    </script>
</body>
</html>