What the customer really needed's game

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

No:7260

3069

←

Prev Next

→

What the customer really needed
Developer User3840｜Date and time 23/7/6 17:29:02
Build time 22.729 sec｜Game capacity 3.416KB｜

Script

了解しました。以下に、スマホで操作可能なゲームの例を示します。

このプログラムは、"Start"ボタンをクリックするとゲームが始まり、ランダムにシャッフルされた絵文字のカードが表示されます。プレイヤーはカードをクリックして、2つのカードをめくります。カードが一致するとカードが消え、全てのカードが消えた時に「Congratulations! You won!」と表示されます。なお、上記のゲームは絵文字を使用していますが、用意された絵文字が表示されない場合は、代替の文字を使用できます。また、スマホでの操作に対応していますが、PCでもプレイ可能です。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

了解しました。以下に、スマホで操作可能なゲームの例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>Emoji Matching Game</title>
  <style>
    .card {
      width: 80px;
      height: 80px;
      font-size: 50px;
      text-align: center;
      padding-top: 10px;
      background-color: lightgray;
      border-radius: 10px;
      margin: 5px;
      float: left;
    }
  </style>
</head>
<body>
  <button onclick="start()">Start</button>
  <div id="gameboard"></div>

function start() {
      shuffleArray(emojis);
      createGameBoard();
    }

function shuffleArray(array) {
      for (var i = array.length - 1; i > 0; i--) {
        var j = Math.floor(Math.random() * (i + 1));
        var temp = array[i];
        array[i] = array[j];
        array[j] = temp;
      }
    }

function createGameBoard() {
      var gameboard = document.getElementById("gameboard");
      gameboard.innerHTML = "";
      cards = [];

for (var i = 0; i < emojis.length; i++) {
        var card = document.createElement("div");
        card.classList.add("card");
        card.innerHTML = emojis[i];
        card.setAttribute("data-index", i);
        card.addEventListener("click", handleCardClick);
        gameboard.appendChild(card);
        cards.push(card);
      }
    }

function handleCardClick(event) {
      var clickedCard = event.target;
      var index = parseInt(clickedCard.getAttribute("data-index"));

if (visibleCards.length < 2 && !visibleCards.includes(clickedCard)) {
        visibleCards.push(clickedCard);
        clickedCard.style.backgroundColor = "white";
        clickedCard.removeEventListener("click", handleCardClick);

if (visibleCards.length === 2) {
          setTimeout(checkMatch, 1000);
        }
      }
    }

function checkMatch() {
      var firstCard = visibleCards[0];
      var secondCard = visibleCards[1];

if (firstCard.innerHTML === secondCard.innerHTML) {
        firstCard.style.visibility = "hidden";
        secondCard.style.visibility = "hidden";
        score += 2;
      } else {
        firstCard.style.backgroundColor = "lightgray";
        secondCard.style.backgroundColor = "lightgray";
        firstCard.addEventListener("click", handleCardClick);
        secondCard.addEventListener("click", handleCardClick);
      }

visibleCards = [];

if (score === emojis.length) {
        alert("Congratulations! You won!");
      }
    }
  </script>
</body>
</html>
```

なお、上記のゲームは絵文字を使用していますが、用意された絵文字が表示されない場合は、代替の文字を使用できます。また、スマホでの操作に対応していますが、PCでもプレイ可能です。