AI game creator

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

No:16079

←

Prev Next

→

鬼ごっこ
Developer User7116｜Date and time 23/9/15 23:32:38
Build time 24.949 sec｜Game capacity 2.415KB｜

Script

了解しました。以下が鬼ごっこのゲームのHTMLとJavaScriptの実装例です。

👻

このプログラムでは、指定したスマホのタッチ操作に応じて"👻"という絵文字のプレイヤー要素が移動します。タッチを開始するとプレイヤー要素がその位置に移動し、そのまま指の動きに応じて移動します。注意点としては、スマホのブラウザ上での実行を前提としていますので、上記のコードをスマホのブラウザ上で実行してください。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

了解しました。以下が鬼ごっこのゲームのHTMLとJavaScriptの実装例です。

```html
<!DOCTYPE html>
<html>
<head>
    <title>鬼ごっこ</title>
    <style>
        #player {
            position: absolute;
            top: 50%;
            left: 50%;
            font-size: 50px;
            transform: translate(-50%, -50%);
        }
    </style>
</head>
<body>
    <div id="player">👻</div>

// スマホのタッチ操作のイベントリスナーを設定
        document.addEventListener("touchstart", (event) => {
            // タッチされた位置を取得
            let touchX = event.touches[0].clientX;
            let touchY = event.touches[0].clientY;

// プレイヤー要素をタッチされた位置に移動
            player.style.left = touchX + "px";
            player.style.top = touchY + "px";

// タッチ操作に応じてプレイヤー要素を移動
            document.addEventListener("touchmove", (event) => {
                let touchMoveX = event.touches[0].clientX;
                let touchMoveY = event.touches[0].clientY;

// 移動量を計算
                let moveX = touchMoveX - touchX;
                let moveY = touchMoveY - touchY;

// 移動量をプレイヤー要素の位置に加算
                x += moveX;
                y += moveY;

// プレイヤー要素を新しい位置に移動
                player.style.left = x + "px";
                player.style.top = y + "px";

// タッチ位置を更新
                touchX = touchMoveX;
                touchY = touchMoveY;
            }, { passive: false });
        });
    </script>
</body>
</html>
```

このプログラムでは、指定したスマホのタッチ操作に応じて"👻"という絵文字のプレイヤー要素が移動します。タッチを開始するとプレイヤー要素がその位置に移動し、そのまま指の動きに応じて移動します。

注意点としては、スマホのブラウザ上での実行を前提としていますので、上記のコードをスマホのブラウザ上で実行してください。