Runner were you jump over blocks's game

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

No:51952

←

Prev Next

→

Runner were you jump over blocks
Developer User21732｜Date and time 24/3/17 6:19:01
Build time 4.54 sec｜Game capacity 1.5KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
<title>Block Runner Game</title>
<style>
    canvas {
        border: 1px solid black;
        background: #f0f0f0;
    }
</style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="300"></canvas>
    <script>
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

let playerX = 50;
        let playerY = 250;
        let blockX = 400;
        let blockY = 250;

function drawPlayer() {
            ctx.fillStyle = "blue";
            ctx.fillRect(playerX, playerY, 50, 50);
        }

function drawBlock() {
            ctx.fillStyle = "red";
            ctx.fillRect(blockX, blockY, 50, 50);
        }

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

blockX -= 5;
            if (blockX < 0) {
                blockX = canvas.width;
            }

drawPlayer();
            drawBlock();

if (playerX < blockX + 50 &&
                playerX + 50 > blockX &&
                playerY < blockY + 50 &&
                playerY + 50 > blockY) {
                alert("Game Over! You hit the block.");
                playerX = 50;
            }

requestAnimationFrame(update);
        }

document.addEventListener("keydown", function(event) {
            if (event.key === " ") {
                playerY -= 50;
            }
        });

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