AI game creator

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

No:37723

←

Prev Next

→

Flappy bird
Developer User17112｜Date and time 24/1/21 14:02:12
Build time 10.209 sec｜Game capacity 3.029KB｜

Script

Sure! Here's an example of a simple Flappy Bird game implemented as a single HTML file using JavaScript. The game will run in a web browser, including smartphones.

To play the game, you need to open this HTML file in a web browser, either on a smartphone or desktop. The game works by tapping the screen (touching) or pressing a key (keypress) to make the bird jump. The goal is to avoid colliding with the green pipes. Your score will increase as you pass through each pair of pipes. If the bird collides with a pipe, the game ends, and your score will be displayed in an alert box. Please note that this is a very basic implementation of Flappy Bird using plain JavaScript and HTML canvas. You can enhance this game by adding better graphics, sounds, and more features as per your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

Sure! Here's an example of a simple Flappy Bird game implemented as a single HTML file using JavaScript. The game will run in a web browser, including smartphones.

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Flappy Bird</title>
    <style>
      canvas {
        border: 1px solid #000;
        display: block;
        margin: 0 auto;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    <script>
      // Get the canvas element and its rendering context
      const canvas = document.getElementById("gameCanvas");
      const context = canvas.getContext("2d");

// Game variables
      let birdX = 50;
      let birdY = canvas.height / 2;
      let velocity = 0;
      let gravity = 0.7;
      let jumpStrength = 9;
      let gap = 150;
      let obstacleWidth = 80;
      let score = 0;

// Handle key press or touch start events
      function jump() {
        velocity = -jumpStrength;
      }
      document.addEventListener("keypress", jump);
      document.addEventListener("touchstart", jump);

// Game loop
      function gameLoop() {
        // Update bird's position
        velocity += gravity;
        birdY += velocity;

// Clear canvas
        context.clearRect(0, 0, canvas.width, canvas.height);

// Draw bird
        context.fillStyle = "#FF0000";
        context.fillRect(birdX, birdY, 30, 30);

// Draw obstacles
        context.fillStyle = "#00FF00";
        context.fillRect(canvas.width - obstacleWidth, 0, obstacleWidth, canvas.height - gap);
        context.fillRect(canvas.width - obstacleWidth, canvas.height, obstacleWidth, -canvas.height + gap);

// Check collision with obstacles
        if (
          birdX + 30 > canvas.width - obstacleWidth &&
          birdX < canvas.width &&
          (birdY < canvas.height - gap || birdY + 30 > canvas.height)
        ) {
          alert("Game over! Score: " + score);
          location.reload(); // Reload the page to start a new game
        }

// Update score and draw
        if (birdX === canvas.width - obstacleWidth) {
          score++;
        }
        context.font = "30px Arial";
        context.fillText("Score: " + score, 10, 50);

// Repeat game loop
        requestAnimationFrame(gameLoop);
      }

// Start the game
      gameLoop();
    </script>
  </body>
</html>
```

Please note that this is a very basic implementation of Flappy Bird using plain JavaScript and HTML canvas. You can enhance this game by adding better graphics, sounds, and more features as per your requirements.