Pac man game with blue background and the little ghost and the player is pack man with pack man animation's game

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

No:9121

131

←

Prev Next

→

Pac man game with blue background and the little g..ALL
Developer User4301｜Date and time 23/7/21 13:25:04
Build time 36.808 sec｜Game capacity 4.615KB｜

Script

Sure! Here's an example of a Pac-Man game using JavaScript and HTML:

This code will create a simple Pac-Man game with a blue background. The player (represented by a yellow square) can be controlled using the arrow keys, and the ghost (represented by a red square) moves randomly. The game detects collisions between the player and the ghost, triggering a "Game Over!" alert.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a Pac-Man game using JavaScript and HTML:

```html
<!DOCTYPE html>
<html>
<head>
<style>
    #game {
        width: 400px;
        height: 400px;
        background-color: #0000FF;
        position: relative;
    }
    .player {
        width: 20px;
        height: 20px;
        background-color: yellow;
        position: absolute;
    }
    .ghost {
        width: 20px;
        height: 20px;
        background-color: red;
        position: absolute;
    }
</style>
</head>
<body>
    <div id="game">
        <div id="player" class="player"></div>
        <div id="ghost" class="ghost"></div>
    </div>

var playerPos = {x: 0, y: 0};
        var ghostPos = {x: 380, y: 380};
        var direction = 'right';

function updatePlayer() {
            player.style.left = playerPos.x + 'px';
            player.style.top = playerPos.y + 'px';
        }

function updateGhost() {
            ghost.style.left = ghostPos.x + 'px';
            ghost.style.top = ghostPos.y + 'px';
        }

if (direction === 'left') {
                playerPos.x -= 5;
            }
            else if (direction === 'up') {
                playerPos.y -= 5;
            }
            else if (direction === 'right') {
                playerPos.x += 5;
            }
            else if (direction === 'down') {
                playerPos.y += 5;
            }

// Wrap player around screen edges
            if (playerPos.x > game.offsetWidth - player.offsetWidth) {
                playerPos.x = 0;
            }
            else if (playerPos.x < 0) {
                playerPos.x = game.offsetWidth - player.offsetWidth;
            }

if (playerPos.y > game.offsetHeight - player.offsetHeight) {
                playerPos.y = 0;
            }
            else if (playerPos.y < 0) {
                playerPos.y = game.offsetHeight - player.offsetHeight;
            }
        }

function moveGhost() {
            var randomNum = Math.floor(Math.random() * 4);

if (randomNum === 0) {
                ghostPos.x -= 5;
            }
            else if (randomNum === 1) {
                ghostPos.y -= 5;
            }
            else if (randomNum === 2) {
                ghostPos.x += 5;
            }
            else if (randomNum === 3) {
                ghostPos.y += 5;
            }

// Wrap ghost around screen edges
            if (ghostPos.x > game.offsetWidth - ghost.offsetWidth) {
                ghostPos.x = 0;
            }
            else if (ghostPos.x < 0) {
                ghostPos.x = game.offsetWidth - ghost.offsetWidth;
            }

if (ghostPos.y > game.offsetHeight - ghost.offsetHeight) {
                ghostPos.y = 0;
            }
            else if (ghostPos.y < 0) {
                ghostPos.y = game.offsetHeight - ghost.offsetHeight;
            }
        }

function checkCollision() {
            var playerRect = player.getBoundingClientRect();
            var ghostRect = ghost.getBoundingClientRect();

if (playerRect.left < ghostRect.right && playerRect.right > ghostRect.left &&
                playerRect.top < ghostRect.bottom && playerRect.bottom > ghostRect.top) {
                alert('Game Over!');
            }
        }

function gameLoop() {
            movePlayer();
            moveGhost();
            checkCollision();
            updatePlayer();
            updateGhost();
            requestAnimationFrame(gameLoop);
        }

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