AI game creator

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

No:20610

104

←

Prev Next

→

🚃ゲーム
Developer User3589｜Date and time 23/10/10 8:11:55
Build time 8.314 sec｜Game capacity 1.625KB｜

Script

は次の通りです：

このプログラムは、黄色い列車をスマホの矢印キーで移動させるシンプルなゲームです。列車は10ピクセルずつ左右に移動します。プログラム内の`train`クラスに対応する要素が列車の表示部分です。JavaScriptの`keydown`イベントを使用して、キーボードの矢印キーが押されたときに列車の位置を更新します。`transform`プロパティを使用して、列車を表示位置に移動させます。この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>Train Game</title>
    <style>
        body {
            text-align: center;
            font-size: 40px;
        }
        .train {
            display: inline-block;
            background-color: yellow;
            width: 100px;
            height: 100px;
        }
    </style>
</head>
<body>
    <div class="train"></div>
    <script>
        const train = document.querySelector('.train');
        let position = 0;
        
        function moveTrain(event) {
            if (event.key === 'ArrowRight') {
                position += 10;
            } else if (event.key === 'ArrowLeft') {
                position -= 10;
            }
            
            train.style.transform = `translateX(${position}px)`;
        }
        
        document.addEventListener('keydown', moveTrain);
    </script>
</body>
</html>
```

このHTMLファイルをブラウザで開くと、スマホの画面上で黄色い列車が表示されます。スマホの矢印キーを押すと、列車が左右に移動します。