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

No:6182

2064

←

Prev Next

→

overturning a table in anger
Developer User3860｜Date and time 23/7/1 19:19:31
Build time 19.114 sec｜Game capacity 1.803KB｜

Script

了解です。以下にサンプルのちゃぶ台返しゲームを実装したhtmlファイルを示します。

ちゃぶ台返しゲーム

画面をタップしてください

このhtmlファイルをブラウザで開くと、画面をタップするたびにちゃぶ台がランダムな位置にひっくり返ります。プログラム内部ではJavaScriptを使用して、DOMの操作とランダムな位置に要素を表示する処理を行っています。

←

Prev　Next

→ 　

Back　

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

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

了解です。以下にサンプルのちゃぶ台返しゲームを実装したhtmlファイルを示します。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ちゃぶ台返しゲーム</title>
</head>
<body>
    <h1>ちゃぶ台返しゲーム</h1>
    <p>画面をタップしてください</p>
    <script>
        // 画面をタップするたびにちゃぶ台が返る
        document.addEventListener('DOMContentLoaded', function() {
            document.body.addEventListener('click', function() {
                flipChabudai();
            });
        });

// ちゃぶ台をひっくり返す処理
        function flipChabudai() {
            var chabudai = document.createElement('span');
            chabudai.innerHTML = '🍽️';
            chabudai.style.fontSize = '50px';
            chabudai.style.transform = 'rotate(180deg)';
            chabudai.style.display = 'inline-block';

// ランダムな位置にちゃぶ台を表示
            var maxX = window.innerWidth - chabudai.offsetWidth;
            var maxY = window.innerHeight - chabudai.offsetHeight;
            var randomX = Math.floor(Math.random() * maxX);
            var randomY = Math.floor(Math.random() * maxY);
            chabudai.style.position = 'absolute';
            chabudai.style.left = randomX + 'px';
            chabudai.style.top = randomY + 'px';

document.body.appendChild(chabudai);
        }
    </script>
</body>
</html>
```