Traveling somewhere in a balloon's game

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

No:6034

291

←

Prev Next

→

Traveling somewhere in a balloon
Developer User3848｜Date and time 23/7/1 14:57:42
Build time 17.722 sec｜Game capacity 1.726KB｜

Script

以下は、気球に乗って何処かへ旅立つというゲームの部分的な実装例です。HTMLファイルに貼り付け、スマートフォンで操作して遊ぶことができます。

🎈

このゲームでは、気球を自動的に上下に動かしています。気球の初期位置は200pxで、移動速度は1px毎の50ミリ秒で更新されます。画面上端または下端に到達した場合には、速度の符号を反転させることで気球が反転するようになっています。動作は1枚のHTMLファイル内で完結しており、スマートフォンで遊ぶことができます。

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>気球で旅するゲーム</title>
    <style>
        #balloon {
            font-size: 50px;
            text-align: center;
            margin-top: 200px;
        }
    </style>
</head>
<body>
    <div id="balloon">🎈</div>

// 気球を自動的に上下に動かす関数
        function moveBalloon() {
            // 気球の位置を更新
            posY += speed;

// 画面上端または下端に到達した場合、速度を反転させる
            if (posY <= 0 || posY >= window.innerHeight - 200) {
                speed *= -1;
            }

// 気球の位置を反映
            document.getElementById('balloon').style.marginTop = posY + 'px';

// 50ミリ秒ごとに移動を繰り返す
            setTimeout(moveBalloon, 50);
        }

// ゲーム開始
        moveBalloon();
    </script>
</body>
</html>
```