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

No:41567

Make a the game named pacman
Developer User18058｜Date and time 24/2/8 12:52:50
Build time 10.625 sec｜Game capacity 3.032KB｜

Script

Pacman Game

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Pacman</title>
  <style>
    #board {
        width: 300px;
        height: 300px;
        display: flex;
        flex-wrap: wrap;
        margin: auto;
    }
    .cell {
        width: 20px;
        height: 20px;
        border: 1px solid black;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 15px;
        font-weight: bold;
    }
    .pacman {
        background-color: yellow;
        border-radius: 50%;
    }
    .ghost {
        background-color: red;
        border-radius: 50%;
    }
    .food {
        background-image: url("food.png");
        background-size: contain;
        background-repeat: no-repeat;
    }
  </style>
</head>
<body>
  <h1>Pacman Game</h1>
  <div id="board"></div>

movePacman(dx, dy);
    };

const movePacman = (dx, dy) => {
        const newX = pacmanPosition.x + dx;
        const newY = pacmanPosition.y + dy;

if(isValidMove(newX, newY)) {
            const currentCell = board[pacmanPosition.y][pacmanPosition.x];
            currentCell.classList.remove('pacman');

const newCell = board[newY][newX];
            newCell.classList.add('pacman');

pacmanPosition.x = newX;
            pacmanPosition.y = newY;

eatFood(newX, newY);
        }
    };

const isValidMove = (x, y) => {
        return (x >= 0 && x < boardSize && y >= 0 && y < boardSize);
    };

const eatFood = (x, y) => {
        const currentCell = board[y][x];
        if (currentCell.classList.contains('food')) {
            currentCell.classList.remove('food');
            score += 10;
            console.log('Score: ' + score);
        }
    };

document.addEventListener('keydown', handleKeyPress);
    createBoard();
  </script>
</body>
</html>