AI game creator

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

No:18708

←

Prev Next

→

Pac-Man
Developer User8248｜Date and time 23/9/30 12:10:26
Build time 11.869 sec｜Game capacity 3.297KB｜

Script

Sure! Here's an example of a simple Pac-Man game implemented in a single HTML file using JavaScript:

This HTML file creates a game container with Pac-Man (`pacman`) and a ghost (`ghost`) represented as colored circles. The game allows the player to move Pac-Man using arrow keys, while the ghost moves randomly. Collision detection is implemented to detect when Pac-Man and the ghost overlap. Please note that this implementation is very basic and serves as a starting point. You can modify and enhance it further to create a more complete and enjoyable Pac-Man game experience.

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

Sure! Here's an example of a simple Pac-Man game implemented in a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Pac-Man Game</title>
  <style>
    #game-container {
      position: relative;
      width: 300px;
      height: 300px;
      border: 1px solid black;
    }
    .pacman {
      position: absolute;
      width: 30px;
      height: 30px;
      background: yellow;
      border-radius: 50%;
      transition: all 0.2s ease-in-out;
    }
    .ghost {
      position: absolute;
      width: 30px;
      height: 30px;
      background: red;
      border-radius: 50%;
      transition: all 0.2s ease-in-out;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <div id="pacman" class="pacman"></div>
    <div id="ghost" class="ghost"></div>
  </div>

let pacmanLeft = 0;
    let pacmanTop = 0;
    let ghostLeft = 270;
    let ghostTop = 270;

function movePacman(direction) {
      switch (direction) {
        case 'up':
          pacmanTop -= 30;
          break;
        case 'down':
          pacmanTop += 30;
          break;
        case 'left':
          pacmanLeft -= 30;
          break;
        case 'right':
          pacmanLeft += 30;
          break;
      }
      
      pacman.style.left = pacmanLeft + 'px';
      pacman.style.top = pacmanTop + 'px';
    }

function moveGhost() {
      const directions = ['up', 'down', 'left', 'right'];
      const randomDirection = directions[Math.floor(Math.random() * directions.length)];

switch (randomDirection) {
        case 'up':
          ghostTop -= 30;
          break;
        case 'down':
          ghostTop += 30;
          break;
        case 'left':
          ghostLeft -= 30;
          break;
        case 'right':
          ghostLeft += 30;
          break;
      }
      
      ghost.style.left = ghostLeft + 'px';
      ghost.style.top = ghostTop + 'px';
    }

function checkCollision() {
      if (pacmanLeft === ghostLeft && pacmanTop === ghostTop) {
        alert('Game Over! Pac-Man was caught by the ghost.');
      }
    }

document.addEventListener('keydown', handleKeyDown);
  </script>
</body>
</html>
```

Please note that this implementation is very basic and serves as a starting point. You can modify and enhance it further to create a more complete and enjoyable Pac-Man game experience.