フラッピーバード's game

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

No:15540

120

←

Prev Next

→

フラッピーバード
Developer User6739｜Date and time 23/9/9 21:26:03
Build time 25.4 sec｜Game capacity 2.306KB｜

Script

ゲームは以下の要素で構成されています。 1. バードの制御: スマホの画面をタップすることでバードが上方向へ移動します。バードは重力の影響を受け、画面の下方向へ落下していきます。 2. パイプ: 画面内を水平に移動するパイプがあります。バードがパイプに当たるとゲームオーバーとなります。以下が実装例です。

🐦

Score: 0

このプログラムでは、バードが上方向へ移動するためにスマホの画面をタップする仕組みを使用しています。また、バードが画面下部に到達した時にゲームオーバーとなり、スコアが表示されます。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

ゲームは以下の要素で構成されています。

1. バードの制御: スマホの画面をタップすることでバードが上方向へ移動します。バードは重力の影響を受け、画面の下方向へ落下していきます。

2. パイプ: 画面内を水平に移動するパイプがあります。バードがパイプに当たるとゲームオーバーとなります。

以下が実装例です。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Flappy Bird</title>
    <style>
        html, body {
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        #bird {
            position: absolute;
            top: 50%;
            left: 50px;
            font-size: 3em;
        }
        .pipe {
            position: absolute;
            width: 50px;
            background-color: green;
            bottom: 0;
        }
        #score {
            position: absolute;
            top: 10px;
            left: 10px;
            font-size: 2em;
        }
    </style>
</head>
<body>
    <div id="bird">🐦</div>
    <div id="score">Score: 0</div>

function updateScore() {
            score++;
            document.getElementById("score").innerHTML = "Score: " + score;
        }

function gameOver() {
            alert("Game Over!");
            location.reload();
        }

document.addEventListener("click", function() {
            birdPosition -= 30;
            document.getElementById("bird").style.top = birdPosition + "px";
        });

setInterval(updateBirdPosition, 200);
        setInterval(updateScore, 1000);
    </script>
</body>
</html>
```