Um jogo aonde você deve fugir de ratos que te perseguem, você deve pegar 3 chaves para abrir a porta verde e ir fugir da sala's game

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

No:26785

←

Prev Next

→

Um jogo aonde você deve fugir de ratos que te pers..ALL
Developer User13247｜Date and time 23/12/2 12:13:19
Build time 43.241 sec｜Game capacity 3.839KB｜

Script

🤺

🔑

🐀

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Jogo de Fugir</title>
    <style>
      #player {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 36px;
      }
      .key {
        position: absolute;
        background-color: yellow;
        width: 50px;
        height: 50px;
        font-size: 32px;
        text-align: center;
        line-height: 50px;
      }
      #door {
        position: absolute;
        background-color: green;
        width: 150px;
        height: 200px;
        top: 40%;
        left: 5%;
      }
      .rat {
        position: absolute;
        font-size: 32px;
      }
      .game-over {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 48px;
        color: red;
      }
    </style>
  </head>
  <body>
    <script>
      // Inicializar as variáveis do jogo
      let playerX = 400;
      let playerY = 300;
      let keysCollected = 0;
      let gameOver = false;
      
      function movePlayer(event) {
        if (gameOver) return;
        
        const speed = 20;
        
        switch (event.key) {
          case 'ArrowUp':
            playerY -= speed;
            break;
          case 'ArrowDown':
            playerY += speed;
            break;
          case 'ArrowLeft':
            playerX -= speed;
            break;
          case 'ArrowRight':
            playerX += speed;
            break;
        }
        
        checkCollision();
        updatePlayerPosition();
      }
      
      function checkCollision() {
        const player = document.getElementById('player');
        const keys = document.getElementsByClassName('key');
        
        // Verificar colisão com as chaves
        Array.from(keys).forEach(key => {
          if (isColliding(player, key)) {
            key.style.display = 'none';
            keysCollected++;
          }
        });
        
        // Verificar colisão com a porta verde
        const door = document.getElementById('door');
        if (isColliding(player, door) && keysCollected === 3) {
          gameOver = true;
          door.innerHTML = 'FUGIU!';
        }
        
        // Verificar colisão com os ratos
        const rats = document.getElementsByClassName('rat');
        Array.from(rats).forEach(rat => {
          if (isColliding(player, rat)) {
            gameOver = true;
            player.style.display = 'none';
            const gameOverText = document.createElement('div');
            gameOverText.innerText = 'GAME OVER';
            gameOverText.className = 'game-over';
            document.body.appendChild(gameOverText);
          }
        });
      }
      
      function isColliding(element1, element2) {
        const rect1 = element1.getBoundingClientRect();
        const rect2 = element2.getBoundingClientRect();
        
        return (
          rect1.left < rect2.right &&
          rect1.right > rect2.left &&
          rect1.top < rect2.bottom &&
          rect1.bottom > rect2.top
        );
      }
      
      function updatePlayerPosition() {
        const player = document.getElementById('player');
        
        player.style.left = playerX + 'px';
        player.style.top = playerY + 'px';
      }
      
      document.addEventListener('keydown', movePlayer);
    </script>
    
    <div id="player">🤺</div>
    <div class="key" style="top: 40%; left: 40%;">🔑</div>
    <div class="key" style="top: 60%; left: 70%;">🔑</div>
    <div class="key" style="top: 70%; left: 30%;">🔑</div>
    <div id="door"></div>
    <div class="rat" style="top: 20%; left: 25%;">🐀</div>
    <div class="rat" style="top: 50%; left: 70%;">🐀</div>
    <div class="rat" style="top: 80%; left: 40%;">🐀</div>
  </body>
</html>