Juego en el que eres un cuadrado y te mueves siguiendo el dedo, tienes que evitar tocar zonas azules o mueres's game

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

No:33114

←

Prev Next

→

Juego en el que eres un cuadrado y te mueves sigui..ALL
Developer User15655｜Date and time 24/1/2 17:16:36
Build time 34.895 sec｜Game capacity 4.487KB｜

Script

🟥

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Juego Square Escape</title>
    <style>
        #game-container {
            position: relative;
            width: 200px;
            height: 200px;
            border: 1px solid black;
            touch-action: none;
        }

#player {
            position: absolute;
            top: 0;
            left: 0;
            width: 50px;
            height: 50px;
            line-height: 50px;
            text-align: center;
            background-color: red;
            color: white;
        }

.obstacle {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: blue;
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="player">🟥</div>
    </div>

var gameInProgress = true;
        var gameOver = false;
        var score = 0;

// Iniciar el juego
        function startGame() {
            gameContainer.addEventListener("touchmove", handleTouchMove);
            gameContainer.addEventListener("touchstart", startTouch);

generateObstacles();
            moveObstacles();
        }

// Mover el jugador siguiendo el dedo
        function handleTouchMove(e) {
            if (e.targetTouches.length === 1) {
                e.preventDefault();

var touch = e.targetTouches[0];
                player.style.left = touch.pageX - 25 + "px";
                player.style.top = touch.pageY - 25 + "px";

checkCollision();
            }
        }

// Generar obstáculos de manera aleatoria
        function generateObstacles() {
            for (var i = 0; i < 5; i++) {
                var obstacle = document.createElement("div");
                obstacle.className = "obstacle";
                obstacle.style.top = Math.floor((Math.random() * 150) + 1) + "px";
                obstacle.style.left = Math.floor((Math.random() * 150) + 1) + "px";
                gameContainer.appendChild(obstacle);
            }
        }

// Mover los obstáculos hacia la izquierda
        function moveObstacles() {
            if (!gameOver) {
                for (var i = 0; i < obstacles.length; i++) {
                    var obstacle = obstacles[i];
                    var obstacleLeft = parseInt(obstacle.style.left);
                    obstacle.style.left = (obstacleLeft - 5) + "px";

if (obstacleLeft <= -50) {
                        obstacle.style.left = "250px";
                        obstacle.style.top = Math.floor((Math.random() * 150) + 1) + "px";
                    }
                }

score++;
                requestAnimationFrame(moveObstacles);
            }
        }

// Comprobar si hay colisión entre el jugador y los obstáculos
        function checkCollision() {
            for (var i = 0; i < obstacles.length; i++) {
                var obstacle = obstacles[i];
                var obstacleRect = obstacle.getBoundingClientRect();
                var playerRect = player.getBoundingClientRect();

if (
                    playerRect.left < obstacleRect.right &&
                    playerRect.right > obstacleRect.left &&
                    playerRect.top < obstacleRect.bottom &&
                    playerRect.bottom > obstacleRect.top
                ) {
                    endGame();
                }
            }
        }

// Finalizar el juego
        function endGame() {
            gameOver = true;
            gameInProgress = false;
            alert("Game Over! Tu puntaje final fue: " + score);
        }

// Clear the game container
        function clearGameContainer() {
            while (gameContainer.firstChild) {
                gameContainer.removeChild(gameContainer.firstChild);
            }
        }

// Reiniciar el juego
        function resetGame() {
            gameOver = false;
            score = 0;
            clearGameContainer();
            startGame();
        }

// Iniciar el juego cuando se carga la página
        document.addEventListener("DOMContentLoaded", function() {
            startGame();
        });
    </script>
</body>
</html>