AI game creator

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

No:12514

←

Prev Next

→

Flappy bird
Developer Ayobami User5156｜Date and time 23/8/19 0:36:39
Build time 21.383 sec｜Game capacity 3.27KB｜

Script

Sure, here's an example of a simple implementation of the game Flappy Bird using HTML and JavaScript:

This code will display a canvas element where the game will be rendered. The player controls the bird by clicking on the screen, making it jump. The objective is to navigate the bird through the gaps between the green obstacles. The score increases every time the bird passes an obstacle. If the bird collides with an obstacle, the game is over, and the score is displayed in an alert dialog. The game will also restart automatically.

←

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 implementation of the game Flappy Bird using HTML and JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Flappy Bird</title>
  <style>
    canvas {
      border: 1px solid #000;
      background: #f7f7f7;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="320" height="480"></canvas>

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

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

function drawObstacle() {
      for (var i = 0; i < obstacles.length; i++) {
        ctx.fillStyle = "green";
        ctx.fillRect(obstacles[i].x, obstacles[i].y, obstacles[i].width, obstacles[i].height);
      }
    }

function updateObstacle() {
      for (var i = 0; i < obstacles.length; i++) {
        obstacles[i].x -= gameSpeed;

if (obstacles[i].x + obstacles[i].width <= 0) {
          obstacles.splice(i, 1);
        }

if (bird.x < obstacles[i].x + obstacles[i].width &&
            bird.x + bird.width > obstacles[i].x &&
            bird.y < obstacles[i].y + obstacles[i].height &&
            bird.y + bird.height > obstacles[i].y) {
          // Collision detected, game over
          gameOver();
        }

if (obstacles[i].x == bird.x) {
          score++;
        }
      }
    }

function drawScore() {
      ctx.fillStyle = "black";
      ctx.font = "20px Arial";
      ctx.fillText("Score: " + score, 10, 25);
    }

function gameOver() {
      clearInterval(gameLoop);
      alert("Game Over! \nScore: " + score);
      location.reload(); // Restart the game
    }

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

drawBird();
      updateBird();

if (obstacles.length < 4) {
        if (obstacles.length === 0) {
          obstacles.push({ x: canvas.width, y: 0, width: 50, height: Math.random() * canvas.height/2 + 20 });
        } else {
          obstacles.push({ x: canvas.width, y: canvas.height - Math.random() * canvas.height/2, width: 50, height: Math.random() * canvas.height/2 + 20 });
        }
      }

drawObstacle();
      updateObstacle();

drawScore();

requestAnimationFrame(gameLoop);
    }

// Game controls
    document.addEventListener("click", function() {
      bird.velocity = -10;
    });

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