Pac-Man With a mega fruit that can make you big and the ghosts can be squashed for all devices's game

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

No:17189

110

←

Prev Next

→

Pac-Man With a mega fruit that can make you big an..ALL
Developer User7570｜Date and time 23/9/22 9:49:25
Build time 48.668 sec｜Game capacity 6.993KB｜

Script

Sure! Here's an example of a simple Pac-Man game implemented as a single HTML file using JavaScript and enclosed in script tags. The game supports smartphone operation and includes pictograms for easy understanding:

To play the game, simply open the HTML file in a web browser on any device, and you'll be able to control Pac-Man using the arrow keys. The objective is to eat the fruit while avoiding the ghosts. If Pac-Man touches a ghost, the game is over, and the score will be displayed. The game will automatically restart after that. When Pac-Man eats a fruit, the user's score increases. Have fun playing!

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Pac-Man Game</title>
    <style>
        #game-container {
            position: relative;
            width: 300px;
            height: 300px;
            border: 1px solid black;
        }
        .player {
            position: absolute;
            top: 0;
            left: 0;
            width: 30px;
            height: 30px;
            background-color: yellow;
            border-radius: 50%;
        }
        .ghost {
            position: absolute;
            width: 30px;
            height: 30px;
            background-color: red;
            border-radius: 50%;
        }
        .fruit {
            position: absolute;
            width: 30px;
            height: 30px;
            background-color: green;
            border-radius: 50%;
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="player" class="player"></div>
        <div id="ghost1" class="ghost"></div>
        <div id="ghost2" class="ghost"></div>
        <div id="fruit" class="fruit"></div>
    </div>

var playerSize = 30;
        var gameContainerSize = 300;
        var gameRunning = false;
        var score = 0;

function startGame() {
            if (gameRunning) return;
            gameRunning = true;
            resetGame();
            movePlayer();
            moveGhosts();
            generateFruit();
        }

function resetGame() {
            player.style.top = '0';
            player.style.left = '0';
            ghost1.style.top = '120px';
            ghost1.style.left = '240px';
            ghost2.style.top = '240px';
            ghost2.style.left = '120px';
            score = 0;
        }

function movePlayer() {
            document.addEventListener('keydown', function(event) {
                var currentPosition = getCurrentPosition(player);

if (event.key === 'ArrowUp' && currentPosition.top > 0) {
                    player.style.top = (currentPosition.top - playerSize) + 'px';
                } else if (event.key === 'ArrowDown' && currentPosition.top < (gameContainerSize - playerSize)) {
                    player.style.top = (currentPosition.top + playerSize) + 'px';
                } else if (event.key === 'ArrowLeft' && currentPosition.left > 0) {
                    player.style.left = (currentPosition.left - playerSize) + 'px';
                } else if (event.key === 'ArrowRight' && currentPosition.left < (gameContainerSize - playerSize)) {
                    player.style.left = (currentPosition.left + playerSize) + 'px';
                }
                
                checkCollision();
            });
        }

function moveGhosts() {
            setInterval(function() {
                var ghost1Position = getCurrentPosition(ghost1);
                var ghost2Position = getCurrentPosition(ghost2);

var direction1 = getRandomDirection();
                var direction2 = getRandomDirection();

ghost1.style.top = applyDirection(ghost1Position.top, direction1) + 'px';
                ghost1.style.left = applyDirection(ghost1Position.left, direction1) + 'px';
                
                ghost2.style.top = applyDirection(ghost2Position.top, direction2) + 'px';
                ghost2.style.left = applyDirection(ghost2Position.left, direction2) + 'px';

checkCollision();
            }, 500);
        }

function getRandomDirection() {
            var directions = ['up', 'down', 'left', 'right'];
            return directions[Math.floor(Math.random() * directions.length)];
        }

function generateFruit() {
            setInterval(function() {
                var fruitPosition = getRandomPosition();
                fruit.style.top = fruitPosition.top + 'px';
                fruit.style.left = fruitPosition.left + 'px';
            }, 3000);
        }

function getCurrentPosition(element) {
            var rect = element.getBoundingClientRect();
            return { top: rect.top, left: rect.left };
        }

function getRandomPosition() {
            var top = Math.floor(Math.random() * (gameContainerSize / playerSize)) * playerSize;
            var left = Math.floor(Math.random() * (gameContainerSize / playerSize)) * playerSize;
            return { top: top, left: left };
        }

function checkCollision() {
            var playerPosition = getCurrentPosition(player);
            var ghost1Position = getCurrentPosition(ghost1);
            var ghost2Position = getCurrentPosition(ghost2);
            var fruitPosition = getCurrentPosition(fruit);

if (playerPosition.top === ghost1Position.top && playerPosition.left === ghost1Position.left) {
                clearInterval(moveGhosts);
                gameRunning = false;
                alert('Game Over! Your score: ' + score);
                startGame();
            }

if (playerPosition.top === ghost2Position.top && playerPosition.left === ghost2Position.left) {
                clearInterval(moveGhosts);
                gameRunning = false;
                alert('Game Over! Your score: ' + score);
                startGame();
            }

if (playerPosition.top === fruitPosition.top && playerPosition.left === fruitPosition.left) {
                fruit.style.top = '-30px';
                fruit.style.left = '-30px';
                score++;
            }
        }

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