AI game creator

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

No:46924

←

Prev Next

→

Flappy bird
Developer User20255｜Date and time 24/2/26 17:09:11
Build time 9.107 sec｜Game capacity 1.6KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<html>
  <head>
    <title>Flappy Bird</title>
    <style>
      canvas {
        border: 1px solid black;
        display: block;
        margin: 0 auto;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="640" height="480"></canvas>
    <script>
      const canvas = document.getElementById("gameCanvas");
      const ctx = canvas.getContext("2d");

const bird = {
        x: 50,
        y: canvas.height / 2 - 10,
        width: 20,
        height: 20,
        velocity: 0
      };

const gravity = 0.8;
      const jumpStrength = -12;
      let gameSpeed = 2;

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

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

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

if (bird.y < 0 || bird.y + bird.height > canvas.height) {
          restartGame();
        }
      }

function birdJump() {
        bird.velocity = jumpStrength;
      }

function restartGame() {
        alert("Game Over! Click OK to restart.");
        bird.y = canvas.height / 2 - 10;
        bird.velocity = 0;
      }

function gameLoop() {
        clearCanvas();
        update();
        drawBird();
        requestAnimationFrame(gameLoop);
      }

document.addEventListener("keypress", function (event) {
        if (event.key === " ") {
          birdJump();
        }
      });

gameLoop();
    </script>
  </body>
</html>
```