AI game creator

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

No:6889

←

Prev Next

→

Mystery Games
Developer User3932｜Date and time 23/7/4 3:56:48
Build time 35.345 sec｜Game capacity 3.403KB｜

Script

了解しました。以下に謎のゲームのサンプルプログラムを示します。

このプログラムは、謎のスライドパズルのゲームです。初期状態では3x3の盤面に絵文字がランダムに配置されています。プレイヤーは空のセルをクリックすることで、上下左右の隣接するセルと入れ替えることができます。パズルが完成すると、おめでとうのメッセージが表示され、盤面が初期状態にリセットされます。ただし、絵文字の表示や実行結果はブラウザによって異なる場合がありますので、適宜修正してご利用ください。また、このプログラムはスマホでも操作可能です。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下に謎のゲームのサンプルプログラムを示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>謎のゲーム</title>
  <style>
    body {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .game-board {
      display: grid;
      gap: 5px;
      grid-template-columns: repeat(3, 1fr);
    }
    .cell {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 50px;
      background-color: lightgray;
      width: 100px;
      height: 100px;
      cursor: pointer;
      transition: background-color 0.3s;
    }
    .cell:hover {
      background-color: gray;
    }
  </style>
</head>
<body>
  <div class="game-board"></div>
  <script>
    const puzzleSize = 3;
    const emptySymbol = '';

const initialState = [
      ['😀', '😁', '😂'],
      ['😃', '😄', '😅'],
      ['😆', '😇', emptySymbol],
    ];

let currentState = [...initialState];

function createGameBoard() {
      const gameBoard = document.querySelector('.game-board');
      gameBoard.innerHTML = '';

currentState.forEach((row, rowIndex) => {
        row.forEach((symbol, columnIndex) => {
          const cell = document.createElement('div');
          cell.classList.add('cell');
          cell.textContent = symbol;
          cell.onclick = () => move(rowIndex, columnIndex);
          gameBoard.appendChild(cell);
        });
      });
    }

function move(row, column) {
      const directions = [
        [-1, 0], // 上
        [1, 0],  // 下
        [0, -1], // 左
        [0, 1],  // 右
      ];

for (const direction of directions) {
        const newRow = row + direction[0];
        const newColumn = column + direction[1];

if (isValidMove(newRow, newColumn)) {
          swap(row, column, newRow, newColumn);
        }
      }

if (isSolved()) {
        setTimeout(() => {
          alert('おめでとう！パズルが完成しました！');
          currentState = [...initialState];
          createGameBoard();
        }, 500);
      }
    }

function isValidMove(row, column) {
      return (
        row >= 0 &&
        row < puzzleSize &&
        column >= 0 &&
        column < puzzleSize &&
        currentState[row][column] === emptySymbol
      );
    }

function swap(row1, column1, row2, column2) {
      const temp = currentState[row1][column1];
      currentState[row1][column1] = currentState[row2][column2];
      currentState[row2][column2] = temp;

createGameBoard();
    }

function isSolved() {
      return JSON.stringify(currentState) === JSON.stringify(initialState);
    }

createGameBoard();
  </script>
</body>
</html>
```

このプログラムは、謎のスライドパズルのゲームです。初期状態では3x3の盤面に絵文字がランダムに配置されています。プレイヤーは空のセルをクリックすることで、上下左右の隣接するセルと入れ替えることができます。パズルが完成すると、おめでとうのメッセージが表示され、盤面が初期状態にリセットされます。

ただし、絵文字の表示や実行結果はブラウザによって異なる場合がありますので、適宜修正してご利用ください。また、このプログラムはスマホでも操作可能です。