AI game creator

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

No:16283

←

Prev Next

→

Pac-Man
Developer User7204｜Date and time 23/9/16 23:38:08
Build time 28.397 sec｜Game capacity 4.275KB｜

Script

Sure! Here's an example of a simple Pac-Man game implemented in a single HTML file using JavaScript:

To play the game, simply open the HTML file in a web browser that supports JavaScript. You can move Pac-Man using the arrow keys and the goal is to eat all the food on the game board.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple Pac-Man game implemented in a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        #game-board {
            position: relative;
            width: 400px;
            height: 400px;
            border: 1px solid black;
        }
        .pacman {
            position: absolute;
            width: 40px;
            height: 40px;
            background: yellow;
            border-radius: 50%;
        }
        .food {
            position: absolute;
            width: 10px;
            height: 10px;
            background: white;
            border-radius: 50%;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>

let score = 0;

const boardWidth = 400;
            const boardHeight = 400;
            const pacmanSize = 40;
            const foodSize = 10;
            const foodCount = 10;

function movePacman(e) {
                const key = e.keyCode;
                let top = parseInt(pacman.style.top) || 0;
                let left = parseInt(pacman.style.left) || 0;

if (key === 38 && top >= 10) { // up
                    pacman.style.top = (top - 10) + "px";
                } else if (key === 40 && top < boardHeight - pacmanSize) { // down
                    pacman.style.top = (top + 10) + "px";
                } else if (key === 37 && left >= 10) { // left
                    pacman.style.left = (left - 10) + "px";
                } else if (key === 39 && left < boardWidth - pacmanSize) { // right
                    pacman.style.left = (left + 10) + "px";
                }

checkCollision();
            }

function checkCollision() {
                const pacmanRect = pacman.getBoundingClientRect();

foods.forEach((food, index) => {
                    const foodRect = food.getBoundingClientRect();

if (
                        pacmanRect.left < foodRect.right &&
                        pacmanRect.right > foodRect.left &&
                        pacmanRect.top < foodRect.bottom &&
                        pacmanRect.bottom > foodRect.top
                    ) {
                        food.parentNode.removeChild(food);
                        foods.splice(index, 1);
                        score++;
                        console.log("Score: " + score);
                    }
                });

if (foods.length === 0) {
                    endGame(true);
                }
            }

function createFood() {
                for (let i = 0; i < foodCount; i++) {
                    const food = document.createElement("div");
                    food.classList.add("food");
                    food.style.left = Math.floor(Math.random() * (boardWidth - foodSize)) + "px";
                    food.style.top = Math.floor(Math.random() * (boardHeight - foodSize)) + "px";
                    gameBoard.appendChild(food);
                    foods.push(food);
                }
            }

function startGame() {
                gameBoard.innerHTML = "";
                score = 0;

pacman.className = "pacman";
                pacman.style.top = "0";
                pacman.style.left = "0";
                gameBoard.appendChild(pacman);

createFood();

document.addEventListener("keydown", movePacman);
            }

function endGame(win) {
                document.removeEventListener("keydown", movePacman);

if (win) {
                    alert("Congrats, you won!");
                } else {
                    alert("Game over!");
                }

startGame();
            }

startGame();
        });
    </script>
</body>
</html>
```

To play the game, simply open the HTML file in a web browser that supports JavaScript. You can move Pac-Man using the arrow keys and the goal is to eat all the food on the game board.