AI game creator

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

No:40753

←

Prev Next

→

Flappy Bird
Developer User18245｜Date and time 24/2/4 3:07:43
Build time 12.625 sec｜Game capacity 4.195KB｜

Script

Sure! Here's an example of a simplified version of Flappy Bird implemented as a single HTML file using JavaScript:

To play the game, open the above code in a web browser, or save it as a .html file and open it. You can control the bird's movement by tapping on the screen. The goal is to navigate the bird through the gaps between the pipes without colliding. Every successful gap pass will increase your score. If the bird collides with the pipes or touches the screen boundaries, the game will end and display your final score.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

Sure! Here's an example of a simplified version of Flappy Bird implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Flappy Bird</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            background-color: #70c5ce;
            overflow: hidden;
        }
        #gameCanvas {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            border: 2px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="300" height="450"></canvas>

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

const pipe = {
                x: canvas.width,
                width: 80,
                bottomY: 0,
                topY: 0,
                gap: 110
            };

let score = 0;

const gapHeightRange = canvas.height - pipe.gap;
            
            document.addEventListener("click", function() {
                bird.velocity -= bird.jump;
            });
            
            function drawBird() {
                context.fillStyle = "#ffcb3d";
                context.fillRect(bird.x, bird.y, bird.width, bird.height);
            }

function drawPipe() {
                context.fillStyle = "#1f8c5d";
                context.fillRect(pipe.x, 0, pipe.width, pipe.topY);
                context.fillRect(pipe.x, pipe.bottomY, pipe.width, canvas.height - pipe.bottomY);
            }

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

function updatePipePosition() {
                pipe.x -= 2;
                
                if (pipe.x + pipe.width < 0) {
                    pipe.x = canvas.width;
                    pipe.topY = Math.random() * gapHeightRange;
                    pipe.bottomY = pipe.topY + pipe.gap;
                    score++;
                }
            }

function checkCollision() {
                if (bird.y + bird.height > canvas.height || bird.y < 0 ||
                    (bird.x + bird.width > pipe.x && bird.x < pipe.x + pipe.width &&
                        (bird.y < pipe.topY || bird.y + bird.height > pipe.bottomY))) {
                    gameOver();
                }
            }

function updateScore() {
                context.fillStyle = "#000";
                context.font = "24px Arial";
                context.fillText("Score: " + score, 10, 25);
            }

function gameOver() {
                alert("Game Over! Your score: " + score);
                resetGame();
            }

function resetGame() {
                bird.y = canvas.height / 2;
                bird.velocity = 0;
                score = 0;
                pipe.x = canvas.width;
                pipe.topY = 0;
                pipe.bottomY = 0;
            }

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

updateBirdPosition();
                updatePipePosition();
                checkCollision();

drawBird();
                drawPipe();
                updateScore();

requestAnimationFrame(gameLoop);
            }

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