Make a maze game, where a dot follows your finger and you go through 10 challenging levels. They are beatable make sure they’re beatable and also have a skip button at the top that makes you half to watch an ad and it brings you to the next level make every single level randomly generated but make sure they’re beatable's game

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

No:49372

←

Prev Next

→

Make a maze game, where a dot follows your finger ..ALL
Developer User21041｜Date and time 24/3/5 0:36:32
Build time 15.127 sec｜Game capacity 2.666KB｜

Script

SKIP

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Maze Game</title>
    <style>
        #maze {
            width: 300px;
            height: 300px;
            background-color: #f0f0f0;
            position: relative;
        }

#player {
            width: 10px;
            height: 10px;
            background-color: blue;
            position: absolute;
            top: 0;
            left: 0;
        }

#finish {
            width: 10px;
            height: 10px;
            background-color: green;
            position: absolute;
            top: 290px;
            left: 290px;
        }

#skip {
            position: absolute;
            top: 10px;
            left: 230px;
            padding: 5px;
            background-color: #ddd;
            cursor: pointer;
        }
    </style>
</head>
<body>

let isDragging = false;

player.addEventListener('touchstart', function(event) {
        isDragging = true;
    });

maze.addEventListener('touchmove', function(event) {
        if (isDragging) {
            let x = event.touches[0].clientX - maze.offsetLeft - player.clientWidth/2;
            let y = event.touches[0].clientY - maze.offsetTop - player.clientHeight/2;

if (x >= 0 && x <= maze.clientWidth - player.clientWidth && y >= 0 && y <= maze.clientHeight - player.clientHeight) {
                player.style.left = x + 'px';
                player.style.top = y + 'px';

if (checkCollision(player, finish)) {
                    alert('Congratulations! You completed the level!');
                    resetPlayer();
                }
            }
        }
    });

maze.addEventListener('touchend', function(event) {
        isDragging = false;
    });

skip.addEventListener('click', function() {
        alert('You skipped the level and watched an ad!');
        resetPlayer();
    });

function checkCollision(elem1, elem2) {
        let rect1 = elem1.getBoundingClientRect();
        let rect2 = elem2.getBoundingClientRect();

return !(rect1.right < rect2.left || 
                 rect1.left > rect2.right || 
                 rect1.bottom < rect2.top || 
                 rect1.top > rect2.bottom);
    }

function resetPlayer() {
        player.style.top = '0px';
        player.style.left = '0px';
    }
</script>

</body>
</html>