Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 157

Warning: in_array() expects parameter 2 to be array, bool given in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 476

Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 484
Hide and seek tag in Nucular bunker's game | AI game creator

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

No:543

366

←

Prev Next

→

Hide and seek tag in Nucular bunker
Developer User3015｜Date and time 23/6/15 12:34:54
Build time 34.112 sec｜Game capacity 3.202KB｜

Script

Hide and Seek Tag in Nucular Bunker

👦

👧

🧑

👻

In this game, players click on the characters to find out who is ”it”. The player identified as ”it” can tag the other players by clicking on them. The player who is tagged becomes ”it”. The game continues until all players are tagged or the players decide to end the game. The characters represent players hiding in a nuclear bunker, hence the title ”Hide and Seek Tag in Nucular Bunker”. The game can be played on a smartphone by simply tapping on the characters.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Hide and Seek Tag in Nucular Bunker</title>
    <style>
      body {
        font-size: 16px;
        text-align: center;
      }

#field {
        width: 80%;
        height: 300px;
        border: 2px solid black;
        margin: 0 auto;
        position: relative;
      }

.player {
        font-size: 30px;
        position: absolute;
      }

#player1 {
        color: blue;
        left: 20%;
      }

#player2 {
        color: red;
        left: 50%;
      }

#player3 {
        color: green;
        left: 80%;
      }

#it {
        color: magenta;
      }

#button {
        margin-top: 20px;
        background-color: yellow;
        border: 2px solid black;
        padding: 10px;
        font-size: 20px;
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <h1>Hide and Seek Tag in Nucular Bunker</h1>
    <div id="field">
      <div class="player" id="player1">👦</div>
      <div class="player" id="player2">👧</div>
      <div class="player" id="player3">🧑</div>
      <div class="player" id="it">👻</div>
    </div>
    <button id="button">Start the Game!</button>
    <script>
      const field = document.getElementById('field');
      const player1 = document.getElementById('player1');
      const player2 = document.getElementById('player2');
      const player3 = document.getElementById('player3');
      const it = document.getElementById('it');
      const button = document.getElementById('button');

button.addEventListener('click', function() {
        const players = [player1, player2, player3];
        const numOfPlayers = players.length;
        const itIndex = Math.floor(Math.random() * numOfPlayers);
        const itPlayer = players.splice(itIndex, 1)[0];

itPlayer.classList.add('it');

field.addEventListener('click', function(event) {
          if (event.target.classList.contains('player')) {
            if (event.target.classList.contains('it')) {
              event.target.classList.remove('it');
              players.push(itPlayer);
              const newItIndex = Math.floor(Math.random() * players.length);
              const newItPlayer = players.splice(newItIndex, 1)[0];
              newItPlayer.classList.add('it');
              it.appendChild(document.createTextNode('👻'));
            } else {
              event.target.style.display = 'none';
              players.splice(players.indexOf(event.target), 1);
            }

if (players.length === 0) {
              alert('Game Over!');
              location.reload();
            }
          }
        });
      });
    </script>
  </body>
</html>

In this game, players click on the characters to find out who is "it". The player identified as "it" can tag the other players by clicking on them. The player who is tagged becomes "it". The game continues until all players are tagged or the players decide to end the game. The characters represent players hiding in a nuclear bunker, hence the title "Hide and Seek Tag in Nucular Bunker". The game can be played on a smartphone by simply tapping on the characters.