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

No:9768

197

←

Prev Next

→

Nurturing Rhythm Game
Developer User3840｜Date and time 23/7/27 13:27:58
Build time 41.871 sec｜Game capacity 5.001KB｜

Script

了解です。以下に育成リズムゲームのサンプルコードを示します。

リズムゲーム

スコア: 0

上記のコードは、リズムゲームのサンプルコードです。ターゲットをクリックしてスコアを稼ぎ、連続でターゲットをクリックすることでコンボボーナスが入ります。ゲームエリアの大きさやターゲットの速度など、ゲームの設定は`gameConfig`オブジェクトで指定できます。画面上部にスタートボタンとスコア表示があります。ゲームエリアは灰色の領域で、ターゲットが表示されます。ターゲットをクリックするとスコアが増え、ゲームエリアから出てしまったターゲットは消えます。以上が育成リズムゲームのサンプルコードです。上記のコードをHTMLファイルに保存し、ウェブブラウザで開くことで実際にゲームをプレイすることができます。

←

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>
</head>
<body>
  <h1>リズムゲーム</h1>
  <button id="startButton">スタート</button>
  <div id="score">スコア: 0</div>
  <div id="gameArea"></div>

// ゲームの状態
    let score = 0;         // スコア
    let combo = 0;         // コンボ数
    let gameIntervalId;    // ゲームのインターバルID
    let targetTimeoutId;   // ターゲットのタイムアウトID

// ゲームエリアを取得
    const gameArea = document.getElementById("gameArea");

// スタートボタンをクリックしたときの処理
    document.getElementById("startButton").addEventListener("click", startGame);

function startGame() {
      // ゲームを初期化
      score = 0;
      combo = 0;
      gameArea.innerHTML = "";
      
      // ゲームエリアのクリックイベントを追加
      gameArea.addEventListener("click", handleGameAreaClick);

// ターゲットの生成を開始
      createTarget();
      
      // ゲームのインターバルを開始
      gameIntervalId = setInterval(moveTargets, 50);
    }

// ターゲットの生成
    function createTarget() {
      const target = document.createElement("div");
      target.className = "target";
      target.style.width = gameConfig.targetRadius * 2 + "px";
      target.style.height = gameConfig.targetRadius * 2 + "px";
      target.style.borderRadius = gameConfig.targetRadius + "px";
      target.style.top = Math.random() * (gameConfig.gameAreaHeight - gameConfig.targetRadius * 2) + "px";
      target.style.left = Math.random() * (gameConfig.gameAreaWidth - gameConfig.targetRadius * 2) + "px";
      gameArea.appendChild(target);

// ターゲットのタイムアウト処理を設定
      targetTimeoutId = setTimeout(createTarget, gameConfig.interval);
    }

// ターゲットの移動
    function moveTargets() {
      const targets = document.getElementsByClassName("target");

for (let i = 0; i < targets.length; i++) {
        const target = targets[i];
        const top = parseInt(target.style.top) + gameConfig.targetSpeed;
        
        if (top > gameConfig.gameAreaHeight - gameConfig.targetRadius * 2) {
          // ターゲットがゲームエリアの底辺に達した場合は削除
          target.parentNode.removeChild(target);
        } else {
          // ターゲットを移動
          target.style.top = top + "px";
        }
      }
    }

// ゲームエリアをクリックしたときの処理
    function handleGameAreaClick(event) {
      const clickedElement = document.elementFromPoint(event.clientX, event.clientY);

if (clickedElement.className == "target") {
        // ターゲットがクリックされた場合
        gameArea.removeChild(clickedElement);
        score += 10 + combo * 10;
        combo++;
      } else {
        // ターゲット以外がクリックされた場合
        combo = 0;
      }

updateScore();
    }

// スコアを更新
    function updateScore() {
      const scoreElement = document.getElementById("score");
      scoreElement.textContent = "スコア: " + score;
    }
  </script>
  <style>
    body {
      text-align: center;
    }
    #gameArea {
      position: relative;
      width: 300px;
      height: 300px;
      background-color: lightgray;
      margin: auto;
      margin-top: 20px;
    }
    .target {
      position: absolute;
      background-color: red;
      cursor: pointer;
    }
  </style>
</body>
</html>
```

以上が育成リズムゲームのサンプルコードです。上記のコードをHTMLファイルに保存し、ウェブブラウザで開くことで実際にゲームをプレイすることができます。