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

No:38662

117

←

Prev Next

→

A wall emoji maze with a red emoji monster chasing..ALL
Developer User17401｜Date and time 24/1/25 7:11:27
Build time 17.915 sec｜Game capacity 5.034KB｜

Script

Sure! Here's an example of a simple emoji maze game implemented as a single HTML file using JavaScript:

Emoji Maze Game

This game displays a simple maze with walls represented by brick emojis, a red monster emoji that chases the player, a black door emoji to reach, and the player represented by a smiling emoji. The player can use the arrow keys to move around the maze, avoiding the monster and reaching the door. Please copy the entire code and save it as an HTML file (e.g., "emoji_maze_game.html"). You can then open the file in a web browser, preferably on a smartphone, to play the game.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

Sure! Here's an example of a simple emoji maze game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Emoji Maze Game</title>
    <style>
        #maze {
            width: 300px;
            height: 300px;
            border: 1px solid black;
            display: flex;
            flex-wrap: wrap;
        }

.cell {
            width: 20px;
            height: 20px;
            font-size: 20px;
            text-align: center;
        }

.monster {
            color: red;
            font-weight: bold;
        }

.door {
            color: black;
        }
    </style>
</head>
<body>
    <h1>Emoji Maze Game</h1>
    <div id="maze"></div>

// Maze layout
        const mazeLayout = [
            [wallEmoji, wallEmoji, wallEmoji, wallEmoji, wallEmoji],
            [wallEmoji, "", monsterEmoji, "", wallEmoji],
            [wallEmoji, "", wallEmoji, "", wallEmoji],
            [wallEmoji, "", wallEmoji, doorEmoji, wallEmoji],
            [wallEmoji, wallEmoji, wallEmoji, wallEmoji, wallEmoji]
        ];

// Initial player position
        let playerPosX = 1;
        let playerPosY = 1;

// Render the maze
        function renderMaze() {
            const mazeElem = document.getElementById("maze");
            mazeElem.innerHTML = "";

for (let i = 0; i < mazeLayout.length; i++) {
                for (let j = 0; j < mazeLayout[i].length; j++) {
                    const cellElem = document.createElement("div");
                    cellElem.classList.add("cell");

if (i === playerPosY && j === playerPosX) {
                        cellElem.textContent = playerEmoji;
                    } else {
                        cellElem.textContent = mazeLayout[i][j];
                    }

mazeElem.appendChild(cellElem);
                }
            }
        }

// Move player
        function movePlayer(direction) {
            let newPlayerPosX = playerPosX;
            let newPlayerPosY = playerPosY;

if (direction === "left") {
                newPlayerPosX--;
            } else if (direction === "right") {
                newPlayerPosX++;
            } else if (direction === "up") {
                newPlayerPosY--;
            } else if (direction === "down") {
                newPlayerPosY++;
            }

// Check if the new position is valid (not a wall or out of bounds)
            if (
                mazeLayout[newPlayerPosY] &&
                mazeLayout[newPlayerPosY][newPlayerPosX] !== wallEmoji
            ) {
                playerPosX = newPlayerPosX;
                playerPosY = newPlayerPosY;
                renderMaze();

// Check if player reached the goal
                if (
                    mazeLayout[newPlayerPosY][newPlayerPosX] === doorEmoji &&
                    !monsterChasing
                ) {
                    setTimeout(() => {
                        alert("Congratulations! You reached the door!");
                    }, 100);
                }
            }

// Check if the monster reached the player
            if (
                mazeLayout[newPlayerPosY][newPlayerPosX] === monsterEmoji &&
                monsterChasing
            ) {
                setTimeout(() => {
                    alert("Game Over! The monster caught you!");
                    resetGame();
                }, 100);
            }
        }

// Game reset
        function resetGame() {
            playerPosX = 1;
            playerPosY = 1;
            renderMaze();
        }

// Keyboard input handling
        document.addEventListener("keydown", (event) => {
            switch (event.key) {
                case "ArrowLeft":
                    movePlayer("left");
                    break;
                case "ArrowRight":
                    movePlayer("right");
                    break;
                case "ArrowUp":
                    movePlayer("up");
                    break;
                case "ArrowDown":
                    movePlayer("down");
                    break;
                default:
                    break;
            }
        });

// Initial render
        renderMaze();
    </script>
</body>
</html>
```

Please copy the entire code and save it as an HTML file (e.g., "emoji_maze_game.html"). You can then open the file in a web browser, preferably on a smartphone, to play the game.