AI game creator

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

No:42994

124

←

Prev Next

→

Flappy bird
Developer User18878｜Date and time 24/2/13 18:15:41
Build time 13.279 sec｜Game capacity 3.877KB｜

Script

Sure! Here's a simple implementation of the Flappy Bird game using HTML and JavaScript:

You can copy and paste the entire code into a single HTML file and open it in a web browser on your smartphone to play the game. Simply tap the screen to make the bird flap and try to navigate through the pipes. If the bird collides with a pipe or reaches the bottom of the screen, the game will be over.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple implementation of the Flappy Bird game using HTML and JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Flappy Bird</title>
    <style>
        canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>

function Bird() {
            this.x = 50;
            this.y = canvas.height / 2;
            this.velocity = 0;
            this.gravity = gravity;

this.flap = function() {
                this.velocity -= 10;
            };

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

if (this.y >= canvas.height) {
                    gameOver();
                }
            };
        }

function Pipe() {
            this.x = canvas.width;
            this.y = Math.floor(Math.random() * (canvas.height - 200)) + 100;

this.update = function() {
                this.x -= 2;

if (this.x + 60 < 0) {
                    this.x = canvas.width;
                    this.y = Math.floor(Math.random() * (canvas.height - 200)) + 100;
                }

if (
                    bird.x + 34 > this.x &&
                    bird.x < this.x + 60 &&
                    (bird.y < this.y || bird.y > this.y + 100)
                ) {
                    gameOver();
                }
            };
        }

function init() {
            canvas = document.getElementById("gameCanvas");
            context = canvas.getContext("2d");
            bird = new Bird();
            pipes = [];
            gravity = 0.5;

canvas.addEventListener("click", function() {
                bird.flap();
            });

setInterval(gameLoop, 20);
            createPipe();
        }

function gameLoop() {
            update();
            render();
        }

function update() {
            bird.update();

for (var i = 0; i < pipes.length; i++) {
                pipes[i].update();
            }

if (pipes.length > 0 && pipes[0].x + 60 <= 0) {
                pipes.shift();
            }

if (pipes.length < 4 && pipes[pipes.length - 1].x < canvas.width - 300) {
                createPipe();
            }
        }

function render() {
            context.clearRect(0, 0, canvas.width, canvas.height);

context.fillStyle = "#4ec0ca";
            context.fillRect(0, 0, canvas.width, canvas.height);

context.fillStyle = "#9acd32";
            context.fillRect(0, canvas.height - 50, canvas.width, 50);

context.fillStyle = "#FFC0CB";
            context.beginPath();
            context.arc(bird.x, bird.y, 17, 0, Math.PI * 2);
            context.fill();

for (var i = 0; i < pipes.length; i++) {
                context.fillStyle = "#7cfc00";
                context.fillRect(pipes[i].x, 0, 60, pipes[i].y);
                context.fillRect(pipes[i].x, pipes[i].y + 100, 60, canvas.height - pipes[i].y - 100);
            }
        }

function createPipe() {
            pipes.push(new Pipe());
        }

function gameOver() {
            alert("Game Over");
            location.reload(); // Restart the game
        }

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