AI game creator

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

No:38349

←

Prev Next

→

Ai S○X Game
Developer User17372｜Date and time 24/1/24 14:52:50
Build time 12.877 sec｜Game capacity 3.732KB｜

Script

Als Programmierer kann ich Ihnen helfen, ein Spiel zu erstellen, basierend auf Ihren Anforderungen. Da Sie eine Smartphone-Bedienung wünschen und Piktogramme verwenden möchten, werde ich ein einfaches Memory-Spiel implementieren. Hier ist der Code:

Sie können den obigen Code in eine HTML-Datei einfügen und sie in Ihrem Smartphone-Browser öffnen, um das Spiel zu spielen. Es handelt sich um ein einfaches Memory-Spiel, bei dem Sie zwei Karten umdrehen und versuchen müssen, Paare von gleichen Piktogrammen zu finden.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Piktogramm Memory-Spiel</title>
  <style>
    .card {
      width: 100px;
      height: 100px;
      background-color: lightgray;
      border: 1px solid gray;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 32px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div id="gameBoard"></div>
  
  <script>
    document.addEventListener('DOMContentLoaded', function() {
      // Piktogramme für das Memory-Spiel
      const pictograms = ['🐶', '🐱', '🐭', '🐰', '🐢', '🐦', '🐸', '🐼'];
      
      // Doppelte Kopien der Piktogramme, um Memory-Kartenpaare zu erstellen
      const cards = pictograms.concat(pictograms);
      
      // Methode zum Mischen der Karten
      function shuffle(array) {
        let currentIndex = array.length, temporaryValue, randomIndex;
      
        while (currentIndex !== 0) {
          randomIndex = Math.floor(Math.random() * currentIndex);
          currentIndex -= 1;
      
          temporaryValue = array[currentIndex];
          array[currentIndex] = array[randomIndex];
          array[randomIndex] = temporaryValue;
        }
      
        return array;
      }
      
      // Das gemischte Kartendeck
      const shuffledCards = shuffle(cards);
      
      // Das Spielfeld-Element
      const gameBoard = document.getElementById('gameBoard');
      
      // Das Spielstatus-Array
      let openedCards = [];
      
      // Spielkarten erstellen und zum Spielfeld hinzufügen
      shuffledCards.forEach(function(pictogram, index) {
        const card = document.createElement('div');
        card.classList.add('card');
        card.dataset.index = index;
        card.innerHTML = '<span> </span>'; // Anfangszustand der Karte
        card.addEventListener('click', handleCardClick);
        gameBoard.appendChild(card);
      });
      
      // Veranstaltet die Kartenklick-Ereignisse
      function handleCardClick(event) {
        const clickedCard = event.target;
        const clickedIndex = clickedCard.dataset.index;
        
        if (openedCards.length < 2 && !openedCards.includes(clickedCard)) {
          // Karte öffnen
          openedCards.push(clickedCard);
          clickedCard.innerHTML = shuffledCards[clickedIndex];
          
          if (openedCards.length === 2) {
            // Überprüfen auf Übereinstimmung
            setTimeout(checkMatch, 1000);
          }
        }
      }
      
      // Überprüft, ob die beiden geöffneten Karten übereinstimmen
      function checkMatch() {
        const cardA = openedCards[0];
        const cardB = openedCards[1];
        
        if (cardA.innerHTML === cardB.innerHTML) {
          // Übereinstimmung gefunden
          cardA.removeEventListener('click', handleCardClick);
          cardB.removeEventListener('click', handleCardClick);
        } else {
          // Keine Übereinstimmung
          cardA.innerHTML = '<span> </span>';
          cardB.innerHTML = '<span> </span>';
        }
        
        openedCards = []; // Zurücksetzen der Kartenliste
      }
    });
  </script>
</body>
</html>
```