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

No:33711

←

Prev Next

→

Matching game
Developer User15904｜Date and time 24/1/6 11:35:37
Build time 32.007 sec｜Game capacity 2.892KB｜

Script

Sure, here's an example of a matching game implemented in a single HTML file with JavaScript:

Matching Game

🐶

🐱

🐰

🐼

🐶

🐱

🐰

🐼

This code creates a simple matching game where you need to find all matching pairs of pictograms. The grid contains 8 cards, each with a different pictogram. When you click on a card, it flips over, and if you match two cards with the same pictogram, they stay flipped. The game continues until all pairs are found. Once you win, an alert message will notify you and the game can be reset. You can copy the code into a text file and save it with a `.html` extension. Then, open it in a web browser (preferably on a smartphone) to play the game.

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

Sure, here's an example of a matching game implemented in a single HTML file with JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Matching Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    .grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px;
    }
    .card {
      height: 100px;
      background-color: lightgray;
      border-radius: 5px;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 30px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>Matching Game</h1>
  <div class="grid">
    <div class="card" onclick="flipCard(this)">🐶</div>
    <div class="card" onclick="flipCard(this)">🐱</div>
    <div class="card" onclick="flipCard(this)">🐰</div>
    <div class="card" onclick="flipCard(this)">🐼</div>
    <div class="card" onclick="flipCard(this)">🐶</div>
    <div class="card" onclick="flipCard(this)">🐱</div>
    <div class="card" onclick="flipCard(this)">🐰</div>
    <div class="card" onclick="flipCard(this)">🐼</div>
  </div>

function resetGame() {
      flippedCards = [];
      matchedCards = [];
      var cards = document.querySelectorAll('.card');
      for (var i = 0; i < cards.length; i++) {
        cards[i].classList.remove('flipped');
      }
    }
  </script>
</body>
</html>
```

You can copy the code into a text file and save it with a `.html` extension. Then, open it in a web browser (preferably on a smartphone) to play the game.