Bird fly and jump blocks's game

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

No:44822

←

Prev Next

→

Bird fly and jump blocks
Developer User19473｜Date and time 24/2/19 7:28:41
Build time 5.438 sec｜Game capacity 1.727KB｜

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>Bird Game</title>
<style>
    body { margin: 0; overflow: hidden; }
    canvas { display: block; }
</style>
</head>
<body>
<canvas id="gameCanvas"></canvas>

const bird = {
    x: 50,
    y: 150,
    size: 20,
    gravity: 0.6,
    lift: -15,
    velocity: 0
};

const blocks = [
    { x: 300, y: 0, width: 50, height: 150 },
    { x: 500, y: 0, width: 50, height: 100 },
    { x: 700, y: 0, width: 50, height: 120 }
];

function drawBird() {
    ctx.fillStyle = "yellow";
    ctx.fillRect(bird.x, bird.y, bird.size, bird.size);
}

function drawBlocks() {
    blocks.forEach(block => {
        ctx.fillStyle = "green";
        ctx.fillRect(block.x, block.y, block.width, block.height);
    });
}

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    drawBird();
    drawBlocks();
}

function update() {
    bird.velocity += bird.gravity;
    bird.y += bird.velocity;

blocks.forEach(block => {
        block.x -= 2;

if (bird.x < block.x + block.width &&
            bird.x + bird.size > block.x &&
            bird.y < block.y + block.height &&
            bird.y + bird.size > block.y) {
            alert("Game Over");
            document.location.reload();
        }
    });

if (bird.y > canvas.height || bird.y < 0) {
        alert("Game Over");
        document.location.reload();
    }

requestAnimationFrame(update);
}

canvas.addEventListener("click", () => {
    bird.velocity = bird.lift;
});

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