festival game in which participants try to catch goldfish in a shallow paper ladle's game

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

No:9151

211

←

Prev Next

→

festival game in which participants try to catch g..ALL
Developer User4271｜Date and time 23/7/21 17:52:28
Build time 28.114 sec｜Game capacity 2.698KB｜

Script

了解しました。以下に金魚すくいゲームの実装例を示します。

Score: 0

Time: 10

この実装では、画面上にランダムに表示される金魚の絵文字を指で触れるとスコアが加算されます。ゲームは制限時間が終了するか、金魚をクリックすることで開始されます。ゲーム終了後にはスコアが表示されます。

←

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>
    body {
      text-align: center;
    }
    #container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    #fish {
      font-size: 60px;
      cursor: pointer;
    }
    #score {
      font-size: 40px;
      margin-bottom: 20px;
    }
    #timer {
      font-size: 40px;
      margin-top: 20px;
    }
  </style>
</head>
<body>
  <div id="container">
    <div id="fish"></div>
  </div>
  <div id="score">Score: 0</div>
  <div id="timer">Time: 10</div>

let score = 0;
    let time = timeLimit;
    let timer;
    let isGamePlaying = false;

function startGame() {
      // ゲーム開始時の設定
      score = 0;
      time = timeLimit;
      isGamePlaying = true;
      updateScore();
      updateTimer();

// 金魚を表示
      const container = document.getElementById("container");
      container.innerHTML = "";
      for (let i = 0; i < numFish; i++) {
        const fish = document.createElement("span");
        fish.innerHTML = "🐠";
        container.appendChild(fish);
      }

// タイマーを設定
      timer = setInterval(() => {
        time--;
        if (time === 0) {
          endGame();
        }
        updateTimer();
      }, 1000);
    }

function endGame() {
      clearInterval(timer);
      isGamePlaying = false;
      alert("ゲーム終了！ スコア: " + score);
    }

function updateScore() {
      document.getElementById("score").textContent = "Score: " + score;
    }

function updateTimer() {
      document.getElementById("timer").textContent = "Time: " + time;
    }

function incrementScore() {
      if (isGamePlaying) {
        score++;
        updateScore();
      }
    }

document.addEventListener("DOMContentLoaded", () => {
      const fish = document.getElementById("fish");

fish.addEventListener("mouseover", () => {
        incrementScore();
      });

fish.addEventListener("click", () => {
        if (!isGamePlaying) {
          startGame();
        }
      });
    });
  </script>
</body>
</html>
```