Frank muss die welt retten. Er kämpft gegen untote und aliens's game

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

No:17927

←

Prev Next

→

Frank muss die welt retten. Er kämpft gegen untote..ALL
Developer User7832｜Date and time 23/9/25 6:48:12
Build time 20.505 sec｜Game capacity 2.405KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Frank muss die Welt retten!</title>
</head>
<body>
    <canvas id="canvas" width="800" height="600"></canvas>
    <script>
        // Einbindung des Canvas-Elements
        const canvas = document.getElementById("canvas");
        const ctx = canvas.getContext("2d");

// Spielobjekte
        const frankImage = new Image();
        frankImage.src = "frank.png";

const zombieImage = new Image();
        zombieImage.src = "zombie.png";

const alienImage = new Image();
        alienImage.src = "alien.png";

// Position der Spielobjekte
        let frankX = canvas.width / 2;
        let frankY = canvas.height / 2;

const zombies = [
            { x: 100, y: 100 },
            { x: 200, y: 300 },
            { x: 400, y: 200 }
        ];

const aliens = [
            { x: 600, y: 100 },
            { x: 700, y: 300 },
            { x: 500, y: 200 }
        ];

// Tastatursteuerung
        const keys = {};
        document.addEventListener("keydown", keyDownHandler, false);
        document.addEventListener("keyup", keyUpHandler, false);

function keyDownHandler(event) {
            keys[event.keyCode] = true;
        }

function keyUpHandler(event) {
            keys[event.keyCode] = false;
        }

// Spiel-Loop
        function draw() {
            // Hintergrund
            ctx.fillStyle = "black";
            ctx.fillRect(0, 0, canvas.width, canvas.height);

// Frank
            ctx.drawImage(frankImage, frankX, frankY);

// Zombies
            zombies.forEach(zombie => {
                ctx.drawImage(zombieImage, zombie.x, zombie.y);
            });

// Aliens
            aliens.forEach(alien => {
                ctx.drawImage(alienImage, alien.x, alien.y);
            });

// Bewegung
            if (keys[37]) { // Left arrow key
                frankX -= 5;
            }
            if (keys[39]) { // Right arrow key
                frankX += 5;
            }
            if (keys[38]) { // Up arrow key
                frankY -= 5;
            }
            if (keys[40]) { // Down arrow key
                frankY += 5;
            }

requestAnimationFrame(draw);
        }

// Spielstart
        frankImage.onload = draw;
    </script>
</body>
</html>