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

No:16194

←

Prev Next

→

Find the chomiks
Developer User7177｜Date and time 23/9/16 16:24:36
Build time 23.693 sec｜Game capacity 3.012KB｜

Script

Find the Chomiks

Click on the pictograms to find the hidden chomiks!

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Find the Chomiks</title>
    <style>
      body {
        text-align: center;
        font-family: Arial, sans-serif;
      }
      
      #game-board {
        margin-top: 20px;
      }
      
      .pictogram {
        width: 80px;
        height: 80px;
        display: inline-block;
        margin: 5px;
        background-size: cover;
        cursor: pointer;
      }
      
      .chomik {
        background-image: url('chomik.png');
      }
      
      .not-chomik {
        background-image: url('not_chomik.png');
      }
    </style>
  </head>
  <body>
    <h1>Find the Chomiks</h1>
    <h3>Click on the pictograms to find the hidden chomiks!</h3>
    <div id="game-board">
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
      <div class="pictogram"></div>
    </div>
    
    <script>
      // Shuffle function to randomly assign chomiks
      function shuffle(array) {
        let currentIndex = array.length, temporaryValue, randomIndex;

// While there remain elements to shuffle...
        while (0 !== currentIndex) {

// Pick a remaining element...
          randomIndex = Math.floor(Math.random() * currentIndex);
          currentIndex -= 1;

// And swap it with the current element.
          temporaryValue = array[currentIndex];
          array[currentIndex] = array[randomIndex];
          array[randomIndex] = temporaryValue;
        }

return array;
      }
      
      // Function to handle the game logic
      function handleClick(event) {
        const target = event.target;
        
        if (target.classList.contains('chomik')) {
          target.classList.remove('chomik');
          target.classList.add('not-chomik');
          target.removeEventListener('click', handleClick);
          alert('Congratulations! You found a chomik!');
        } else {
          target.style.opacity = "0.5";
          alert('Oops! Not a chomik, try again.');
        }
      }
      
      // Game initialization
      function initializeGame() {
        const pictograms = document.querySelectorAll('.pictogram');
        const chomikIndex = Math.floor(Math.random() * 9); // Randomly determine the chomik location
        
        pictograms.forEach((pictogram, index) => {
          pictogram.addEventListener('click', handleClick);
          pictogram.classList.remove('chomik', 'not-chomik'); // Clear previous states
          pictogram.style.opacity = "1"; // Reset opacity
          
          if (index === chomikIndex) {
            pictogram.classList.add('chomik');
          } else {
            pictogram.classList.add('not-chomik');
          }
        });
      }
      
      initializeGame(); // Start the game
      
    </script>
  </body>
</html>