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

No:5094

1021

←

Prev Next

→

transferring from one world to another
Developer もちきなこ｜Date and time 23/6/29 18:09:13
Build time 26.26 sec｜Game capacity 2.549KB｜

Script

了解しました。以下のような簡単なゲームを作成します。

スマホタップゲーム

ターゲットをタップしてスコアを稼ごう！

スコア: 0

残りの時間: 10秒

このプログラムでは、画面内をタップしてランダムに表示されるターゲットを指定した時間内にできるだけたくさんタップするというゲームです。ターゲットをタップするたびにスコアが増え、指定した時間経過後にゲーム終了となります。また、ゲーム終了時にはスコアがポップアップで表示されます。このプログラムはHTMLファイル1枚に実装され、JavaScriptは`
`タグ内に記述されています。HTMLファイルをスマートフォンで開いてプレイすることができます。

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

了解しました。以下のような簡単なゲームを作成します。

```html
<!DOCTYPE html>
<html>
<head>
    <title>スマホタップゲーム</title>
    <style>
        html, body {
            height: 100%;
            margin: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

#target {
            font-size: 100px;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <h1>スマホタップゲーム</h1>
    <p>ターゲットをタップしてスコアを稼ごう！</p>
    <h2>スコア: <span id="score">0</span></h2>
    <h2>残りの時間: <span id="time">10</span>秒</h2>
    
    <script>
        let score = 0;
        let time = 10;

const target = document.getElementById("target");
        const scoreElement = document.getElementById("score");
        const timeElement = document.getElementById("time");

target.addEventListener("click", () => {
            score++;
            scoreElement.textContent = score;
            moveTarget();
        });

function decreaseTime() {
            time--;
            timeElement.textContent = time;
            
            if (time === 0) {
                endGame();
            }
        }

function moveTarget() {
            target.style.left = Math.floor(Math.random() * (window.innerWidth - target.offsetWidth)) + "px";
            target.style.top = Math.floor(Math.random() * (window.innerHeight - target.offsetHeight)) + "px";
        }

function endGame() {
            target.removeEventListener("click", () => {});
            clearInterval(interval);

alert("ゲーム終了！あなたのスコアは" + score + "点です！");
        }

moveTarget();
        const interval = setInterval(decreaseTime, 1000);
    </script>
</body>
</html>
```

このプログラムでは、画面内をタップしてランダムに表示されるターゲットを指定した時間内にできるだけたくさんタップするというゲームです。ターゲットをタップするたびにスコアが増え、指定した時間経過後にゲーム終了となります。また、ゲーム終了時にはスコアがポップアップで表示されます。

このプログラムはHTMLファイル1枚に実装され、JavaScriptは`<script>`タグ内に記述されています。HTMLファイルをスマートフォンで開いてプレイすることができます。