something indistinct's game

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

No:9727

135

←

Prev Next

→

something indistinct
Developer User3840｜Date and time 23/7/26 23:20:13
Build time 20.676 sec｜Game capacity 2.386KB｜

Script

了解です。闇夜のカラスというゲームを作成します。以下が実装例です。

Score: 0

🦅

このゲームでは、スコアがカラスをクリックすることで加算されていきます。カラスはランダムな位置に配置され、クリックされると再配置されます。スコアは画面上部に表示されます。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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 {
      margin: 0;
      padding: 0;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    #game {
      width: 100%;
      text-align: center;
    }
    #score {
      font-size: 24px;
      margin-bottom: 16px;
    }
    #crow {
      font-size: 72px;
      cursor: pointer;
      transition: transform 0.2s;
    }
    #crow:hover {
      transform: scale(1.5);
    }
  </style>
</head>
<body>
  <div id="game">
    <div id="score">Score: 0</div>
    <div id="crow">🦅</div>
  </div>

// ゲームスコア
    let score = 0;

// スコア表示用の要素を取得
    const scoreElement = document.getElementById("score");

// カラスがクリックされたときの処理
    function onCrowClick() {
      // スコアを加算
      score++;
      scoreElement.textContent = `Score: ${score}`;

// カラスを再配置
      const crow = document.getElementById("crow");
      const game = document.getElementById("game");
      const gameWidth = game.clientWidth;
      const gameHeight = game.clientHeight;
      const crowWidth = crow.offsetWidth;
      const crowHeight = crow.offsetHeight;
      const newPosLeft = Math.random() * (gameWidth - crowWidth);
      const newPosTop = Math.random() * (gameHeight - crowHeight);
      crow.style.left = `${newPosLeft}px`;
      crow.style.top = `${newPosTop}px`;
    }

// カラスの要素を作成
    function createCrows() {
      const game = document.getElementById("game");

for (let i = 0; i < numCrows; i++) {
        const crow = document.createElement("div");
        crow.innerHTML = "🦅";
        crow.id = "crow";
        crow.addEventListener("click", onCrowClick);
        game.appendChild(crow);
      }
    }

// ゲーム開始
    createCrows();
  </script>
</body>
</html>
```