AI game creator

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

No:28007

←

Prev Next

→

Flappy bird
Developer User11353｜Date and time 23/12/10 15:01:36
Build time 25.052 sec｜Game capacity 3.271KB｜

Script

Sure! Here's an example of a simple Flappy Bird game implemented in a single HTML file:

To run this game, save the HTML file with a ".html" extension and open it in a web browser. The game will start automatically, and you can tap/click on the screen to make the bird jump and avoid the pipes. The score will be displayed at the top left corner. If the bird collides with a pipe or the top/bottom of the game area, the game will end, and the final score will be shown in an alert dialog.

←

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 in a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Flappy Bird</title>
  <style>
    #game {
      position: relative;
      width: 400px;
      height: 600px;
      border: 1px solid black;
      overflow: hidden;
    }
    #bird {
      position: absolute;
      top: 250px;
      left: 50px;
      width: 50px;
      height: 50px;
      background-image: url('bird.png');
      background-size: cover;
    }
    .pipe {
      position: absolute;
      width: 80px;
      height: 400px;
      background-color: green;
    }
    #score {
      position: absolute;
      top: 10px;
      left: 10px;
      font-size: 24px;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <div id="game">
    <div id="bird"></div>
    <div id="score">0</div>
  </div>
  
  <script>
    var bird = document.getElementById('bird');
    var game = document.getElementById('game');
    var scoreDisplay = document.getElementById('score');

var gameWidth = game.offsetWidth;
    var gameHeight = game.offsetHeight;
    var birdHeight = bird.offsetHeight;
    var gravity = 0.5;
    var velocity = 0;
    var pipes = [];
    var score = 0;

function startGame() {
      game.addEventListener('click', jump);
      setInterval(updateGame, 20);
      setInterval(addPipe, 2000);
    }

function jump() {
      velocity = -10;
    }

function updateGame() {
      velocity += gravity;
      bird.style.top = bird.offsetTop + velocity + 'px';

if (bird.offsetTop < 0 || bird.offsetTop + birdHeight > gameHeight) {
        gameOver();
      }

for (var i = 0; i < pipes.length; i++) {
        var pipeX = pipes[i].offsetLeft - 2;
        var pipeY = pipes[i].offsetTop;
        var pipeWidth = pipes[i].offsetWidth;
        var pipeHeight = pipes[i].offsetHeight;

if (bird.offsetLeft + bird.offsetWidth > pipeX && bird.offsetLeft < pipeX + pipeWidth &&
            (bird.offsetTop < pipeY + pipeHeight || bird.offsetTop + birdHeight > pipeY + pipeHeight + 120)) {
          gameOver();
        }

if (bird.offsetLeft + bird.offsetWidth === pipeX + pipeWidth) {
          score++;
          scoreDisplay.textContent = score;
        }

if (pipeX + pipeWidth < 0) {
          game.removeChild(pipes[i]);
          pipes.splice(i, 1);
        }
      }
    }

function addPipe() {
      var pipeHeight = Math.floor(Math.random() * (gameHeight / 2)) + 50;
      var pipe = document.createElement('div');
      pipe.className = 'pipe';
      pipe.style.height = pipeHeight + 'px';
      game.appendChild(pipe);
      pipes.push(pipe);
    }

function gameOver() {
      game.removeEventListener('click', jump);
      clearInterval(updateGame);
      alert('Game Over! Your score: ' + score);
    }

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