AI game creator

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

No:9912

162

←

Prev Next

→

Pac-man
Developer User4443｜Date and time 23/7/28 7:22:57
Build time 30.018 sec｜Game capacity 4.572KB｜

Script

Sure! Here's a simple implementation of the classic Pac-Man game in a single HTML file. The game is designed to be played on a smartphone and uses pictograms for the characters.

Score: 0

Please note that this is a simple implementation and may have limited functionality compared to a fully-fledged Pac-Man game. You can enhance it further according to your requirements.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple implementation of the classic Pac-Man game in a single HTML file. The game is designed to be played on a smartphone and uses pictograms for the characters.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Pac-Man</title>
  <style>
    #game-board {
      display: grid;
      grid-template-columns: repeat(10, 1fr);
      grid-template-rows: repeat(10, 1fr);
      gap: 2px;
      background-color: black;
      padding: 10px;
    }
    
    .cell {
      background-color: blue;
      border-radius: 50%;
    }
    
    #pacman {
      background-color: yellow;
    }
    
    #ghost1 {
      background-color: red;
    }
    
    #ghost2 {
      background-color: pink;
    }
    
    #ghost3 {
      background-color: cyan;
    }
    
    #score {
      text-align: center;
      margin-top: 10px;
      font-size: 24px;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>
  <div id="score">Score: 0</div>

// Initialize game board
    var gameBoard = document.getElementById("game-board");
    for (var i = 0; i < 100; i++) {
      var cell = document.createElement("div");
      cell.className = "cell";
      gameBoard.appendChild(cell);
    }

// Update game board
    function updateGameBoard() {
      var cells = document.getElementsByClassName("cell");
      for (var i = 0; i < cells.length; i++) {
        cells[i].innerHTML = "";
      }

var pacmanCell = document.getElementById("pacman");
      pacmanCell.innerHTML = "👻"; // Replace with pacman pictogram

var ghost1Cell = document.getElementById("ghost1");
      ghost1Cell.innerHTML = "👻"; // Replace with ghost pictogram

var ghost2Cell = document.getElementById("ghost2");
      ghost2Cell.innerHTML = "👻"; // Replace with ghost pictogram

var ghost3Cell = document.getElementById("ghost3");
      ghost3Cell.innerHTML = "👻"; // Replace with ghost pictogram

cells[pacmanPosition.x + pacmanPosition.y * 10].appendChild(pacmanCell);
      cells[ghost1Position.x + ghost1Position.y * 10].appendChild(ghost1Cell);
      cells[ghost2Position.x + ghost2Position.y * 10].appendChild(ghost2Cell);
      cells[ghost3Position.x + ghost3Position.y * 10].appendChild(ghost3Cell);
    }

// Move Pac-Man
    function movePacman(direction) {
      var nextPosition = { x: pacmanPosition.x, y: pacmanPosition.y };

if (direction === "up" && pacmanPosition.y > 0) {
        nextPosition.y--;
      } else if (direction === "down" && pacmanPosition.y < 9) {
        nextPosition.y++;
      } else if (direction === "left" && pacmanPosition.x > 0) {
        nextPosition.x--;
      } else if (direction === "right" && pacmanPosition.x < 9) {
        nextPosition.x++;
      }

if (nextPosition.x === ghost1Position.x && nextPosition.y === ghost1Position.y) {
        gameOver();
        return;
      }

if (nextPosition.x === ghost2Position.x && nextPosition.y === ghost2Position.y) {
        gameOver();
        return;
      }

if (nextPosition.x === ghost3Position.x && nextPosition.y === ghost3Position.y) {
        gameOver();
        return;
      }

pacmanPosition = nextPosition;
      updateGameBoard();
    }

// Game Over
    function gameOver() {
      alert("Game Over");
      // You can implement further actions here, like resetting the game or saving the score.
    }

// Play the game
    updateGameBoard();

// Handle touch events on the game board
    gameBoard.addEventListener("touchstart", function(event) {
      var touchX = event.touches[0].clientX;
      var touchY = event.touches[0].clientY;

var rect = gameBoard.getBoundingClientRect();
      var cellSize = (rect.width - 20) / 10;

var cellX = Math.floor((touchX - rect.left - 10) / cellSize);
      var cellY = Math.floor((touchY - rect.top - 10) / cellSize);

if (cellX > pacmanPosition.x) {
        movePacman("right");
      } else if (cellX < pacmanPosition.x) {
        movePacman("left");
      } else if (cellY > pacmanPosition.y) {
        movePacman("down");
      } else if (cellY < pacmanPosition.y) {
        movePacman("up");
      }
    });
  </script>
</body>
</html>
```

Please note that this is a simple implementation and may have limited functionality compared to a fully-fledged Pac-Man game. You can enhance it further according to your requirements.