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

No:42565

Der name d3s spiels heisst: Einhorn racer. Es soll..ALL
Developer User18910｜Date and time 24/2/12 3:30:02
Build time 10.134 sec｜Game capacity 3.212KB｜

Script

Einhorn Racer

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Einhorn Racer</title>
    <style>
        body {
            background-color: #f1f1f1;
            text-align: center;
        }
        h1 {
            color: #333;
        }
        img {
            width: 100px;
            height: 100px;
        }
        #player {
            position: relative;
            top: 0;
            left: 0;
        }
        #obstacle {
            position: absolute;
            top: 0;
            left: 0;
        }
    </style>
</head>
<body>
    <h1>Einhorn Racer</h1>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <script>
        // Einhorn Racer Spiel

// Spielvariablen
        var canvas, ctx;
        var player, obstacle;
        var gameOver;
        var score;

// Einhorn
        var playerImg = new Image();
        playerImg.src = "unicorn.png";

// Hindernis
        var obstacleImg = new Image();
        obstacleImg.src = "obstacle.png";

// Tastatursteuerung
        document.addEventListener("keydown", movePlayer);

// Spielinitialisierung
        function startGame() {
            canvas = document.getElementById("gameCanvas");
            ctx = canvas.getContext("2d");
            player = { x: 0, y: 0 };
            obstacle = { x: canvas.width - 100, y: 0 };
            gameOver = false;
            score = 0;
            draw();
        }

// Spielerbewegung
        function movePlayer(event) {
            if (gameOver) return;
            var key = event.keyCode;
            if (key === 38) {
                player.y -= 10; // Nach oben
            } else if (key === 40) {
                player.y += 10; // Nach unten
            }
            draw();
        }

// Kollisionsprüfung
        function checkCollision() {
            if (player.x + playerImg.width > obstacle.x &&
                player.x < obstacle.x + obstacleImg.width &&
                player.y + playerImg.height > obstacle.y) {
                gameOver = true;
            }
        }

// Zeichnen der Spielobjekte
        function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

if (!gameOver) {
                player.y = Math.min(Math.max(player.y, 0), canvas.height - playerImg.height);
                obstacle.x -= 5;

if (obstacle.x + obstacleImg.width <= 0) {
                    obstacle.x = canvas.width - 100;
                    obstacle.y = Math.floor(Math.random() * canvas.height);
                    score++;
                }

ctx.drawImage(playerImg, player.x, player.y);
                ctx.drawImage(obstacleImg, obstacle.x, obstacle.y);

checkCollision();

ctx.font = "20px Arial";
                ctx.fillStyle = "#333";
                ctx.fillText("Score: " + score, 10, 30);

requestAnimationFrame(draw);
            } else {
                ctx.font = "30px Arial";
                ctx.fillStyle = "#333";
                ctx.fillText("Game Over", canvas.width / 2 - 100, canvas.height / 2);
            }
        }

// Spielstart
        startGame();
    </script>
</body>
</html>