There are puzzle pieces of 1 yen, 5 yen, 10 yen, 50 yen, 100 yen, and 500 yen, and by putting them together, they exchange into the amount above and disappear when they reach 1000 yen. The goal of this falling puzzle is to successfully erase the puzzle pieces.'s game

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

No:8835

746

←

Prev Next

→

There are puzzle pieces of 1 yen, 5 yen, 10 yen, 5..ALL
Developer User4253｜Date and time 23/7/18 19:34:09
Build time 42.2 sec｜Game capacity 4.535KB｜

Script

以下は、要求された仕様に基づいて作成されたHTMLゲームの例です。このゲームは、スマートフォンでプレイすることを前提としており、絵文字を使用して実装されています。

このHTMLファイルをブラウザで開くと、ゲームがプレイできます。画面の上部に「Start Game」というボタンが表示されるので、それをクリックするとゲームが始まります。ゲームの目標は、パズルピースをくっつけて1000円になるように組み合わせることです。パズルピースは1秒ごとにランダムに生成され、クリックすることで取り除くことができます。組み合わせが1000円以上になると、自動的にパズルピースが消えていきます。ゲームの進行状況は画面の下部に表示されるスコアで確認できます。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
<style>
  body {
    font-size: 30px;
  }
  #game-board {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
  }
</style>
</head>
<body>
  <div id="game-board"></div>
  <script>
    // ゲームの状態を保持する変数
    let gameBoard = [];
    let score = 0;

// パズルピースの種類と価値を定義
    const puzzlePieces = [
      { emoji: "💲", value: 1 },
      { emoji: "🔄", value: 5 },
      { emoji: "🔟", value: 10 },
      { emoji: "💰", value: 50 },
      { emoji: "💵", value: 100 },
      { emoji: "💲💲", value: 500 }
    ];

// パズルピースをランダムに生成する関数
    function generatePiece() {
      const randomIndex = Math.floor(Math.random() * puzzlePieces.length);
      return puzzlePieces[randomIndex];
    }

// パズルピースのHTML要素を作成する関数
    function createPieceElement(piece) {
      const pieceElement = document.createElement("div");
      pieceElement.textContent = piece.emoji;
      pieceElement.style.textAlign = "center";
      pieceElement.style.cursor = "pointer";
      pieceElement.addEventListener("click", () => {
        removePiece(piece);
      });
      return pieceElement;
    }

// パズルピースを追加する関数
    function addPiece() {
      const piece = generatePiece();
      const pieceElement = createPieceElement(piece);

const emptyCell = gameBoard.findIndex(cell => cell === null);
      if (emptyCell !== -1) {
        gameBoard[emptyCell] = piece;
        document.getElementById("game-board").appendChild(pieceElement);
      }

checkCombination();
    }

// パズルピースを削除する関数
    function removePiece(piece) {
      const pieceIndex = gameBoard.findIndex(cell => cell === piece);
      if (pieceIndex !== -1) {
        gameBoard[pieceIndex] = null;
        document.getElementById("game-board").children[pieceIndex].remove();
        score += piece.value;
      }
      updateScore();
      checkCombination();
    }

// 現在のスコアを更新する関数
    function updateScore() {
      document.getElementById("score").textContent = `Score: ${score}`;
    }

// 組み合わせをチェックし、1000円になっている場合はパズルピースを削除する関数
    function checkCombination() {
      const combinationValue = gameBoard.reduce((total, piece) => total + (piece ? piece.value : 0), 0);
      if (combinationValue >= 1000) {
        gameBoard = gameBoard.filter(piece => !piece);
        document.getElementById("game-board").innerHTML = "";
        updateScore();
      }
    }

// ゲームを開始する関数
    function startGame() {
      gameBoard = Array(6).fill(null);
      score = 0;
      updateScore();

const addPieceInterval = setInterval(() => {
        addPiece();
        if (score >= 1000) {
          clearInterval(addPieceInterval);
        }
      }, 1000);
    }

// ゲームを開始するためのボタンを作成
    const startButton = document.createElement("button");
    startButton.textContent = "Start Game";
    startButton.style.fontSize = "30px";
    startButton.style.padding = "10px 20px";
    startButton.addEventListener("click", startGame);
    document.body.appendChild(startButton);

// スコア表示用の要素を作成
    const scoreElement = document.createElement("div");
    scoreElement.id = "score";
    scoreElement.textContent = "Score: 0";
    scoreElement.style.fontSize = "30px";
    document.body.appendChild(scoreElement);
  </script>
</body>
</html>
```