Un juego donde estamos en un laberinto y tenemos que escapar mientras nos persigue un bot que si nos toca,morimos,y la cámara sigue al jugador.'s game

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

No:40791

←

Prev Next

→

Un juego donde estamos en un laberinto y tenemos q..ALL
Developer User18058｜Date and time 24/2/4 5:22:06
Build time 11.081 sec｜Game capacity 3.182KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Juego del laberinto</title>
    <style>
      #maze {
        width: 500px;
        height: 500px;
        margin: 0 auto;
        position: relative;
      }
      #player {
        width: 25px;
        height: 25px;
        position: absolute;
        background-color: blue;
      }
      #bot {
        width: 25px;
        height: 25px;
        position: absolute;
        background-color: red;
      }
    </style>
  </head>
  <body>
    <div id="maze"></div>

// Establecer posiciones iniciales del jugador y del bot
      const mazeWidth = maze.offsetWidth;
      const mazeHeight = maze.offsetHeight;
      const playerSize = player.offsetWidth;
      const botSize = bot.offsetWidth;
      let playerX = Math.floor(Math.random() * (mazeWidth - playerSize));
      let playerY = Math.floor(Math.random() * (mazeHeight - playerSize));
      let botX = Math.floor(Math.random() * (mazeWidth - botSize));
      let botY = Math.floor(Math.random() * (mazeHeight - botSize));

// Función para mover al jugador
      function movePlayer(event) {
        switch (event.key) {
          case 'ArrowUp':
            if (playerY > 0) playerY -= 10;
            break;
          case 'ArrowDown':
            if (playerY < mazeHeight - playerSize) playerY += 10;
            break;
          case 'ArrowLeft':
            if (playerX > 0) playerX -= 10;
            break;
          case 'ArrowRight':
            if (playerX < mazeWidth - playerSize) playerX += 10;
            break;
        }
        player.style.left = `${playerX}px`;
        player.style.top = `${playerY}px`;

// Comprobar si el jugador ha sido alcanzado por el bot
        if (isCollision(player, bot)) {
          alert('¡Has perdido! El bot te ha atrapado.');
          resetGame();
        }
      }

// Función para comprobar colisiones entre dos elementos
      function isCollision(element1, element2) {
        const rect1 = element1.getBoundingClientRect();
        const rect2 = element2.getBoundingClientRect();
        return !(
          rect1.right < rect2.left ||
          rect1.left > rect2.right ||
          rect1.bottom < rect2.top ||
          rect1.top > rect2.bottom
        );
      }

// Función para reiniciar el juego
      function resetGame() {
        playerX = Math.floor(Math.random() * (mazeWidth - playerSize));
        playerY = Math.floor(Math.random() * (mazeHeight - playerSize));
        botX = Math.floor(Math.random() * (mazeWidth - botSize));
        botY = Math.floor(Math.random() * (mazeHeight - botSize));
        player.style.left = `${playerX}px`;
        player.style.top = `${playerY}px`;
        bot.style.left = `${botX}px`;
        bot.style.top = `${botY}px`;
      }

// Iniciar el juego y sus eventos
      resetGame();
      document.addEventListener('keydown', movePlayer);
    </script>
  </body>
</html>