AI game creator

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

No:39467

←

Prev Next

→

Pac-Man
Developer User17653｜Date and time 24/1/28 14:36:44
Build time 9.017 sec｜Game capacity 2.785KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Pac-Man</title>
    <style>
        #game-board {
            display: grid;
            grid-template-columns: repeat(20, 1fr);
            grid-template-rows: repeat(20, 1fr);
            gap: 1px;
            background-color: black;
        }
        .dot {
            background-color: yellow;
        }
        #pacman {
            background-image: url('pacman.png');
            background-size: cover;
        }
        .ghost {
            background-image: url('ghost.png');
            background-size: cover;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>
    <script>
        const boardSize = 20;
        const pacmanSpeed = 200;
        let pacmanPosition = { x: 10, y: 10 };
        let direction = 'right';
        let intervalId;

function drawPacman() {
            const gameBoard = document.getElementById('game-board');
            const pacmanIndex = pacmanPosition.x + pacmanPosition.y * boardSize;
            const pacmanElement = document.createElement('div');
            pacmanElement.id = 'pacman';

const currentPacman = gameBoard.querySelector('#pacman');
            if (currentPacman) {
                currentPacman.remove();
            }

const pacmanCell = gameBoard.children[pacmanIndex];
            pacmanCell.appendChild(pacmanElement);
        }

drawPacman();
        }

function handleKeyPress(event) {
            const keys = ['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'];

if (keys.includes(event.key)) {
                direction = event.key.toLowerCase().replace('arrow', '');
            }
        }

function startGame() {
            createGameBoard();
            drawPacman();
            intervalId = setInterval(movePacman, pacmanSpeed);
            document.addEventListener('keydown', handleKeyPress);
        }

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