nothing ventured, nothing gained's game

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

No:9714

199

←

Prev Next

→

nothing ventured, nothing gained
Developer User3788｜Date and time 23/7/26 22:00:58
Build time 18.766 sec｜Game capacity 2.366KB｜

Script

了解です。以下に示すのは、スマホで遊べる、シンプルなゲームの例です。

このプログラムでは、画面内に黄色のボックスが表示されます。ボックスはスマホの矢印キーで操作することができます。矢印キーの押下に応じて、ボックスの位置が変化します。

←

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>
        #box {
            width: 100px;
            height: 100px;
            background-color: yellow;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            transition: all 0.2s;
        }
    </style>
</head>
<body>
    <div id="box"></div>

// ボックスの初期位置
        let x = 50;
        let y = 50;

// ボックスを移動させる処理
        function moveBox(direction) {
            switch (direction) {
                case "up":
                    y -= 10;
                    break;
                case "down":
                    y += 10;
                    break;
                case "left":
                    x -= 10;
                    break;
                case "right":
                    x += 10;
                    break;
                default:
                    break;
            }

// ボックスの位置を更新
            box.style.top = `${y}%`;
            box.style.left = `${x}%`;
        }

// キーボードイベントのハンドラ
        function handleKeyDown(event) {
            switch (event.key) {
                case "ArrowUp":
                    moveBox("up");
                    break;
                case "ArrowDown":
                    moveBox("down");
                    break;
                case "ArrowLeft":
                    moveBox("left");
                    break;
                case "ArrowRight":
                    moveBox("right");
                    break;
                default:
                    break;
            }
        }

// キーボードイベントのリスナーを設定
        document.addEventListener("keydown", handleKeyDown);
    </script>
</body>
</html>
```