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

No:20341

←

Prev Next

→

Jogo de cartas
Developer User9019｜Date and time 23/10/9 6:26:29
Build time 17.166 sec｜Game capacity 3.388KB｜

Script

Jogo de Cartas

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Jogo de Cartas</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }

h1 {
      color: #333;
    }

.card-container {
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 50px;
    }

.card {
      width: 100px;
      height: 150px;
      border: 1px solid #333;
      border-radius: 5px;
      background-color: #FFF;
      margin: 0 10px;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 24px;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }
    
    .card.face-down {
      background-color: #333;
      color: #FFF;
    }
  </style>
</head>
<body>
  <h1>Jogo de Cartas</h1>
  
  <div class="card-container">
    <div class="card face-down">?</div>
    <div class="card face-down">?</div>
    <div class="card face-down">?</div>
  </div>
  
  <script>
    // Embaralhar o array de cartas
    function shuffle(array) {
      for (let i = array.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [array[i], array[j]] = [array[j], array[i]];
      }
    }
    
    // Iniciar um novo jogo
    function startGame() {
      const cards = ['A', 'A', 'B', 'B', 'C', 'C'];
      shuffle(cards);
      
      const cardElements = document.getElementsByClassName('card');
      
      // Atribuir as cartas ao elemento HTML correspondente
      for (let i = 0; i < cardElements.length; i++) {
        const cardElement = cardElements[i];
        cardElement.classList.remove('face-down');
        cardElement.textContent = cards[i];
      }
    }
    
    // Virar uma carta
    function flipCard(event) {
      const cardElement = event.target;
      
      if (!cardElement.classList.contains('face-down')) {
        return;
      }
      
      cardElement.classList.remove('face-down');
      
      const flippedCards = document.getElementsByClassName('face-down');
      
      // Verificar se duas cartas foram viradas
      if (flippedCards.length === 0) {
        checkMatch();
      }
    }
    
    // Verificar se a primeira e a segunda carta virada são iguais
    function checkMatch() {
      const flippedCards = document.getElementsByClassName('face-down');
      
      if (flippedCards[0].textContent === flippedCards[1].textContent) {
        setTimeout(function() {
          flippedCards[0].remove();
          flippedCards[1].remove();
          
          const remainingCards = document.getElementsByClassName('face-down');
          
          // Verificar se todas as cartas foram removidas
          if (remainingCards.length === 0) {
            setTimeout(function() {
              alert('Parabéns! Você concluiu o jogo.');
              startGame();
            }, 500);
          }
        }, 500);
      } else {
        setTimeout(function() {
          flippedCards[0].classList.add('face-down');
          flippedCards[1].classList.add('face-down');
        }, 500);
      }
    }
    
    // Event listeners para virar as cartas ao serem clicadas
    const cards = document.getElementsByClassName('card');
    for (let i = 0; i < cards.length; i++) {
      cards[i].addEventListener('click', flipCard);
    }
    
    // Iniciar o jogo ao carregar a página
    startGame();
  </script>
</body>
</html>