AI game creator

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

No:24669

114

←

Prev Next

→

Flappy bird.
Developer The maker｜Date and time 23/11/11 4:12:32
Build time 136.948 sec｜Game capacity 4.58KB｜

Script

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

This HTML file contains the necessary JavaScript code to run a basic version of the Flappy Bird game. The game can be played on a smartphone by tapping on the screen to make the bird jump. The game features a simple graphical representation using filled rectangles. Please note that this is a simplified version of Flappy Bird and doesn't include all the features of the original game. It should give you an idea of how to implement a basic game using JavaScript and HTML though.

←

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 with JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Flappy Bird</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>

// Game variables
        let canvas, ctx;
        let birdX, birdY, birdVelocity;
        let obstacles;
        let score;

function startGame() {
            canvas = document.getElementById("gameCanvas");
            ctx = canvas.getContext("2d");

birdX = 50;
            birdY = canvas.height / 2;
            birdVelocity = 0;

obstacles = [];
            score = 0;

document.addEventListener("keydown", jump);

setInterval(updateGame, 20);
            setInterval(spawnObstacle, OBSTACLE_SPAWN_INTERVAL);
        }

function jump(event) {
            if (event.keyCode === 32) { // Space key
                birdVelocity = -JUMP_FORCE;
            }
        }

function updateGame() {
            clearCanvas();
            moveBird();
            moveObstacles();
            drawBird();
            drawObstacles();
            drawScore();

if (checkCollision()) {
                endGame();
            }
        }

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

function moveBird() {
            birdY += birdVelocity;
            birdVelocity += GRAVITY;

if (birdY < 0) {
                birdY = 0;
                birdVelocity = 0;
            }

if (birdY + 20 > canvas.height) {
                birdY = canvas.height - 20;
                birdVelocity = 0;
            }
        }

function moveObstacles() {
            for (let i = obstacles.length - 1; i >= 0; i--) {
                obstacles[i].x -= OBSTACLE_SPEED;

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

function drawBird() {
            ctx.fillStyle = "yellow";
            ctx.fillRect(birdX, birdY, 20, 20);
        }

function drawObstacles() {
            for (let i = 0; i < obstacles.length; i++) {
                ctx.fillStyle = "green";
                ctx.fillRect(obstacles[i].x, 0, OBSTACLE_WIDTH, obstacles[i].topHeight);
                ctx.fillRect(obstacles[i].x, obstacles[i].bottomY, OBSTACLE_WIDTH, obstacles[i].bottomHeight);
            }
        }

function spawnObstacle() {
            const topHeight = Math.floor(Math.random() * (canvas.height - GAP_HEIGHT));
            const bottomY = topHeight + GAP_HEIGHT;
            const bottomHeight = canvas.height - bottomY;

obstacles.push({ x: canvas.width, topHeight, bottomY, bottomHeight });
        }

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

function checkCollision() {
            for (let i = 0; i < obstacles.length; i++) {
                if (
                    birdX + 20 >= obstacles[i].x &&
                    birdX <= obstacles[i].x + OBSTACLE_WIDTH &&
                    (birdY <= obstacles[i].topHeight || birdY + 20 >= obstacles[i].bottomY)
                ) {
                    return true;
                }
            }

return false;
        }

function endGame() {
            ctx.fillStyle = "red";
            ctx.font = "40px Arial";
            ctx.fillText("Game Over", canvas.width / 2 - 100, canvas.height / 2);
            clearInterval();
        }

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

Please note that this is a simplified version of Flappy Bird and doesn't include all the features of the original game. It should give you an idea of how to implement a basic game using JavaScript and HTML though.