AI game creator

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

No:39997

←

Prev Next

→

神経衰弱
Developer User8917｜Date and time 24/1/31 17:05:45
Build time 19.112 sec｜Game capacity 3.586KB｜

Script

了解です。神経衰弱のゲームを作成します。

このコードをhtmlファイルに保存し、ブラウザで開くと神経衰弱のゲームがプレイできます。各カードをクリックして同じ絵文字のカードを探し、全てのカードを揃えることを目指してください。揃ったカードは表示されたままになりますが、揃わない場合は一定時間後に裏返ります。ゲームクリア後にはアラートが表示され、ゲームがリセットされます。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

了解です。神経衰弱のゲームを作成します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>神経衰弱</title>
  <style>
    .card {
      width: 80px;
      height: 120px;
      background-color: lightgray;
      display: inline-block;
      margin: 5px;
      text-align: center;
      font-size: 36px;
      cursor: pointer;
    }
    .hidden {
      background-image: none;
      background-color: white;
    }
    .matched {
      visibility: hidden;
    }
  </style>
</head>
<body>
  <div id="game"></div>

// カードの絵文字リスト
    const emojis = ['❤️', '❤️', '✨', '✨', '⚡️', '⚡️', '🌈', '🌈', '☀️', '☀️', '🌼', '🌼', '⭐️', '⭐️', '🐶', '🐶'];

// カードをシャッフルする
    const shuffledEmojis = shuffle(emojis);

// カードを表すHTMLを生成する
    const cardsHTML = shuffledEmojis.map((emoji, index) => `
      <div class="card" onclick="selectCard(${index})">
        <div class="hidden" id="card${index}">
          ${emoji}
        </div>
      </div>
    `).join('');

// ゲームのdiv要素にカードを表示する
    const gameDiv = document.getElementById('game');
    gameDiv.innerHTML = cardsHTML;

let selectedCardIndex = null;
    let matchedCount = 0;

function selectCard(index) {
      const cardDiv = document.getElementById(`card${index}`);
      cardDiv.classList.remove('hidden');
      cardDiv.classList.add('matched');

if (selectedCardIndex === null) {
        selectedCardIndex = index;
      } else {
        if (shuffledEmojis[selectedCardIndex] === shuffledEmojis[index]) {
          // カードが一致した場合
          matchedCount += 2;
          if (matchedCount === shuffledEmojis.length) {
            // ゲームクリアの処理
            setTimeout(() => {
              alert('えぼぉいある！');
              resetGame();
            }, 500);
          }
        } else {
          // カードが一致しなかった場合
          setTimeout(() => {
            const selectedCardDiv = document.getElementById(`card${selectedCardIndex}`);
            cardDiv.classList.add('hidden');
            selectedCardDiv.classList.add('hidden');
          }, 500);
        }
        selectedCardIndex = null;
      }
    }