AI game creator

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

No:10528

←

Prev Next

→

Pac-Man
Developer User4570｜Date and time 23/7/31 20:58:20
Build time 20.573 sec｜Game capacity 2.32KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Pac-Man</title>
    <style>
        #game-container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

#pacman {
            position: relative;
            width: 40px;
            height: 40px;
            background: url('pacman.png') top left no-repeat;
            background-size: cover;
            animation: movePacman 1s infinite;
        }

@keyframes movePacman {
            0% { background-position: 0 0; }
            20% { background-position: -40px 0; }
            40% { background-position: -80px 0; }
            60% { background-position: -120px 0; }
            80% { background-position: -160px 0; }
            100% { background-position: -200px 0; }
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="pacman"></div>
    </div>

function movePacman(keyCode) {
            var pacman = document.getElementById('pacman');
            var step = 10;

switch (keyCode) {
                case 37: // Left arrow key
                    if (parseInt(pacman.style.left) - step >= 0) {
                        pacman.style.left = parseInt(pacman.style.left) - step + 'px';
                    }
                    break;
                case 38: // Up arrow key
                    if (parseInt(pacman.style.top) - step >= 0) {
                        pacman.style.top = parseInt(pacman.style.top) - step + 'px';
                    }
                    break;
                case 39: // Right arrow key
                    if (parseInt(pacman.style.left) + step <= window.innerWidth - step) {
                        pacman.style.left = parseInt(pacman.style.left) + step + 'px';
                    }
                    break;
                case 40: // Down arrow key
                    if (parseInt(pacman.style.top) + step <= window.innerHeight - step) {
                        pacman.style.top = parseInt(pacman.style.top) + step + 'px';
                    }
                    break;
            }
        }
    </script>
</body>
</html>