AI game creator

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

No:5808

547

←

Prev Next

→

phase change gun
Developer User3832｜Date and time 23/6/30 20:48:57
Build time 29.985 sec｜Game capacity 2.7KB｜

Script

了解です。以下にスマホで遊べるシンプルなゲームのサンプルを示します。

このゲームは縦または横のいずれかの列に自身のマークを3つ揃えると勝利となります。各プレイヤーはクリックを交互に行い、勝利条件や引き分けを判定します。注意点として、絵文字の代わりに文字列を使用しています。ご了承ください。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

了解です。以下にスマホで遊べるシンプルなゲームのサンプルを示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>ゲーム</title>
  <style>
    #game {
      width: 200px;
      height: 200px;
      border: 1px solid black;
      display: flex;
      flex-wrap: wrap;
      overflow: hidden;
    }
    .tile {
      width: 50px;
      height: 50px;
      font-size: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
  </style>
</head>
<body>
  <div id="game"></div>

// タイルを生成し、クリックイベントを追加する
        const gameEl = document.getElementById('game');
        for (let i = 0; i < 4; i++) {
          const tile = document.createElement('div');
          tile.className = 'tile';
          tile.addEventListener('click', () => {
            this.play(i);
          });
          gameEl.appendChild(tile);
          this.tiles.push(tile);
        }
      }

// プレイヤーがタイルをクリックした際の処理
      play(index) {
        if (this.gameOver) return; // ゲーム終了後は何もしない

// タイルの内容を更新し、ターンを交代する
        this.tiles[index].textContent = this.turn;
        this.tiles[index].style.pointerEvents = 'none'; // クリックを無効化

if (this.checkWin()) {
          alert(`${this.turn}の勝ちです！`);
          this.gameOver = true;
        } else if (this.checkDraw()) {
          alert('引き分けです！');
          this.gameOver = true;
        } else {
          this.turn = (this.turn === '○') ? '×' : '○';
        }
      }

// 勝利条件をチェック
      checkWin() {
        return (
          this.tiles[0].textContent === this.turn &&
          this.tiles[1].textContent === this.turn &&
          this.tiles[2].textContent === this.turn
        );
      }

// 引き分けをチェック
      checkDraw() {
        return this.tiles.every(tile => tile.textContent !== '');
      }
    }

// ゲームのインスタンスを生成
    const game = new Game();
  </script>
</body>
</html>
```