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

No:4957

6609

←

Prev Next

→

文字がバラバラになるゲーム画面上に表示されている全ての文字が、ランダムな方向に動き回ります。..ALL
Developer もちきなこ｜Date and time 23/6/29 1:46:03
Build time 28.63 sec｜Game capacity 3.257KB｜

Script

了解しました。以下が要件を満たすゲームの実装例です。

文字がバラバラになるゲーム

あいうえお

このゲームでは、画面上の文字がランダムな方向に動き回ります。プレイヤーは文字をタップすると、タップされた文字が正しい位置に戻ります。このゲームはスマホでもプレイできますし、絵文字を使用することも可能です。ゲーム全体は1つのHTMLファイルで実装されており、必ずJavaScriptを含んでいます（`
`タグ内）。ご要望に添えるようなゲームが作れたらと思います。ご不明点があれば、遠慮なくお聞きください。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下が要件を満たすゲームの実装例です。

```html
<!DOCTYPE html>
<html>
<head>
    <title>文字がバラバラになるゲーム</title>
    <style>
        #game-container {
            position: relative;
            width: 300px;
            height: 300px;
            border: 1px solid #000;
            font-size: 24px;
            text-align: center;
        }

.letter {
            position: absolute;
            top: 0;
            left: 0;
            transition: top 1s ease, left 1s ease;
        }
    </style>
</head>
<body>
    <h1>文字がバラバラになるゲーム</h1>

// 文字のリセット
        function resetLetter(letter) {
            letter.style.top = '0';
            letter.style.left = '0';
        }

// ゲームの開始
        function startGame() {
            const letters = document.getElementsByClassName('letter');

// 文字の初期位置をランダムに設定
            for (let i = 0; i < letters.length; i++) {
                const letter = letters[i];
                const containerWidth = document.getElementById('game-container').offsetWidth;
                const containerHeight = document.getElementById('game-container').offsetHeight;
                const letterWidth = letter.offsetWidth;
                const letterHeight = letter.offsetHeight;
                const maxLeft = containerWidth - letterWidth;
                const maxTop = containerHeight - letterHeight;

letter.style.top = getRandomInt(0, maxTop) + 'px';
                letter.style.left = getRandomInt(0, maxLeft) + 'px';
            }
        }

// ゲームのイベントハンドラ
        function gameEventHandler(event) {
            const target = event.target;

// クリックされた要素が文字なら、その文字を正しい位置に戻す
            if (target.classList.contains('letter')) {
                resetLetter(target);
            }
        }

// イベントリスナの設定
        document.addEventListener('DOMContentLoaded', startGame);
        document.addEventListener('click', gameEventHandler);
    </script>
</body>
</html>
```

このゲームでは、画面上の文字がランダムな方向に動き回ります。プレイヤーは文字をタップすると、タップされた文字が正しい位置に戻ります。このゲームはスマホでもプレイできますし、絵文字を使用することも可能です。ゲーム全体は1つのHTMLファイルで実装されており、必ずJavaScriptを含んでいます（`<script>`タグ内）。

ご要望に添えるようなゲームが作れたらと思います。ご不明点があれば、遠慮なくお聞きください。