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

No:43535

←

Prev Next

→

Tic Tac Toe
Developer Bowgray｜Date and time 24/2/16 0:31:09
Build time 13.458 sec｜Game capacity 2.97KB｜

Script

Sure! Here's a simple implementation of Tic Tac Toe game in a single HTML file, using JavaScript and enclosed in script tags. You can play it on a smartphone, and it uses pictograms for the symbols:

Tic Tac Toe

To play the game, simply copy the code above into a file with `.html` extension, and open it in any web browser. You can tap on the tiles of the Tic Tac Toe board to make your moves. Enjoy the game!

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

Sure! Here's a simple implementation of Tic Tac Toe game in a single HTML file, using JavaScript and enclosed in script tags. You can play it on a smartphone, and it uses pictograms for the symbols:

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Tic Tac Toe</title>
  <style>
    body {
      font-size: 24px;
      text-align: center;
    }
    .board {
      display: inline-block;
      width: 200px;
      height: 200px;
      border: 2px solid #000;
    }
    .tile {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 66px;
      height: 66px;
      border: 1px solid #000;
      font-size: 48px;
    }
  </style>
</head>
<body>
  <h1>Tic Tac Toe</h1>
  <div class="board">
    <div class="tile" onclick="makeMove(0, 0)"></div>
    <div class="tile" onclick="makeMove(0, 1)"></div>
    <div class="tile" onclick="makeMove(0, 2)"></div>
    <div class="tile" onclick="makeMove(1, 0)"></div>
    <div class="tile" onclick="makeMove(1, 1)"></div>
    <div class="tile" onclick="makeMove(1, 2)"></div>
    <div class="tile" onclick="makeMove(2, 0)"></div>
    <div class="tile" onclick="makeMove(2, 1)"></div>
    <div class="tile" onclick="makeMove(2, 2)"></div>
  </div>
  <script>
    const board = [
      ['', '', ''],
      ['', '', ''],
      ['', '', '']
    ];

let currentPlayer = 'cross';

function makeMove(row, col) {
      if (board[row][col] === '') {
        board[row][col] = currentPlayer;
        document.getElementsByClassName('tile')[row * 3 + col].innerText = currentPlayer;
        currentPlayer = currentPlayer === 'cross' ? 'circle' : 'cross';
        checkGameOver();
      }
    }

function checkGameOver() {
      const winningCombinations = [
        [[0, 0], [0, 1], [0, 2]],
        [[1, 0], [1, 1], [1, 2]],
        [[2, 0], [2, 1], [2, 2]],
        [[0, 0], [1, 0], [2, 0]],
        [[0, 1], [1, 1], [2, 1]],
        [[0, 2], [1, 2], [2, 2]],
        [[0, 0], [1, 1], [2, 2]],
        [[0, 2], [1, 1], [2, 0]]
      ];

for (const combination of winningCombinations) {
        const [a, b, c] = combination;

if (
          board[a[0]][a[1]] !== '' &&
          board[a[0]][a[1]] === board[b[0]][b[1]] &&
          board[a[0]][a[1]] === board[c[0]][c[1]]
        ) {
          alert(`${board[a[0]][a[1]]} wins!`);
          resetBoard();
          return;
        }
      }

if (board.flat().every(symbol => symbol !== '')) {
        alert("It's a draw!");
        resetBoard();
      }
    }

function resetBoard() {
      board.forEach(row => row.fill(''));
      Array.from(document.getElementsByClassName('tile')).forEach(tile => tile.innerText = '');
      currentPlayer = 'cross';
    }
  </script>
</body>
</html>
```

To play the game, simply copy the code above into a file with `.html` extension, and open it in any web browser. You can tap on the tiles of the Tic Tac Toe board to make your moves. Enjoy the game!