Create a purple maze runner with pacman style with white character to move through maze's game

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

No:48487

←

Prev Next

→

Create a purple maze runner with pacman style with..ALL
Developer User20713｜Date and time 24/3/2 9:38:23
Build time 6.806 sec｜Game capacity 2.051KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Purple Maze Runner</title>
    <style>
        #maze {
            display: grid;
            grid-template-columns: repeat(10, 50px);
            grid-template-rows: repeat(10, 50px);
            background-color: purple;
        }

.cell {
            width: 50px;
            height: 50px;
            background-color: black;
        }

#player {
            width: 50px;
            height: 50px;
            background-color: white;
        }
    </style>
</head>
<body>
    <div id="maze"></div>

for (let i = 0; i < 100; i++) {
            const cell = document.createElement('div');
            cell.className = 'cell';
            maze.appendChild(cell);
        }

const player = document.createElement('div');
        player.id = 'player';
        maze.appendChild(player);

let playerPosition = 0;

player.style.gridArea = `${Math.floor(playerPosition / 10) + 1} / ${(playerPosition % 10) + 1}`;

if (playerPosition === 99) {
                alert('Congratulations, you win!');
            }
        });
    </script>
</body>
</html>