AI game creator

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

No:5913

2874

←

Prev Next

→

the shot put
Developer User3840｜Date and time 23/7/1 1:52:38
Build time 24.983 sec｜Game capacity 2.703KB｜

Script

了解です。以下は、スマホ操作を前提としたゲームの例です。プレイヤーはスワイプ（フリック）の操作で砲丸を投げることができます。

このプログラムは、砲丸がターゲットに当たるたびにスコアが加算されるシンプルなゲームです。プレイヤーが砲丸（赤いブロック）をスワイプで移動させることができます。ターゲット（緑のブロック）をクリックするとスコアが加算され、1.5秒後にターゲットが再表示されます。スコアは画面上部に表示されます。

←

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>
        #gameArea {
            width: 300px;
            height: 300px;
            background-color: lightblue;
            position: relative;
            overflow: hidden;
            border: 1px solid black;
            margin: 0 auto;
        }

#player {
            width: 50px;
            height: 50px;
            background-color: red;
            position: absolute;
            bottom: 0;
            left: 0;
            transition: left 0.3s ease;
        }

#target {
            width: 100px;
            height: 100px;
            background-color: green;
            position: absolute;
            bottom: 0;
            right: 0;
        }

#results {
            margin-top: 10px;
            text-align: center;
        }
    </style>
</head>
<body>
    <div id="gameArea">
        <div id="player"></div>
        <div id="target"></div>
    </div>

let score = 0;

target.addEventListener('click', () => {
            score++;
            results.textContent = `スコア: ${score}`;
            target.style.display = 'none';
            setTimeout(() => {
                target.style.display = 'block';
            }, 1500);
        });

let isMoving = false;
        let startX = 0;
        let moveX = 0;

player.addEventListener('touchstart', (e) => {
            isMoving = true;
            startX = e.touches[0].pageX;
        });

player.addEventListener('touchmove', (e) => {
            if (!isMoving) return;
            moveX = e.touches[0].pageX - startX;
            player.style.left = moveX + 'px';
        });

player.addEventListener('touchend', () => {
            isMoving = false;
        });
    </script>
</body>
</html>
```