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

No:550

277

←

Prev Next

→

⚪︎×10 in the game×A game of 10 squares, the first ..ALL
Developer User3020｜Date and time 23/6/15 15:17:06
Build time 72.32 sec｜Game capacity 4.283KB｜

Script

を実装しました。以下が実際のプログラムになります。

⚪︎×ゲーム

最初に5つ縦か横か斜めの直線上に自分のしるしを並べた方が勝ちです。

このプログラムにより、スマホで操作して遊べる⚪︎×ゲームが実装されました。絵文字を使用して、より楽しいゲーム体験を提供しています。

←

Prev　Next

→ 　

Back　

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

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

を実装しました。

以下が実際のプログラムになります。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>⚪︎×ゲーム</title>
	<style>
		body {
			font-size: 24px;
		}
		table, td {
			border: 1px solid black;
			padding: 20px;
			text-align: center;
			font-size: 48px;
			cursor: pointer;
		}
		.result {
			font-size: 32px;
			margin-top: 30px;
			display: none;
		}
	</style>
</head>
<body>
	<h1>⚪︎×ゲーム</h1>
	<p>最初に5つ縦か横か斜めの直線上に自分のしるしを並べた方が勝ちです。</p>
	<table id="board">
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
		<tr>
			<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
		</tr>
	</table>
	<div class="result"></div>
	<script>
		// 変数
		var turn = "●";
		var board = document.getElementById("board");
		var cells = board.getElementsByTagName("td");
		var result = document.getElementsByClassName("result")[0];
		var winningLines = [
			[[0,0],[0,1],[0,2],[0,3],[0,4]],
			[[1,0],[1,1],[1,2],[1,3],[1,4]],
			[[2,0],[2,1],[2,2],[2,3],[2,4]],
			[[3,0],[3,1],[3,2],[3,3],[3,4]],
			[[4,0],[4,1],[4,2],[4,3],[4,4]],
			[[0,0],[1,0],[2,0],[3,0],[4,0]],
			[[0,1],[1,1],[2,1],[3,1],[4,1]],
			[[0,2],[1,2],[2,2],[3,2],[4,2]],
			[[0,3],[1,3],[2,3],[3,3],[4,3]],
			[[0,4],[1,4],[2,4],[3,4],[4,4]],
			[[0,0],[1,1],[2,2],[3,3],[4,4]],
			[[0,4],[1,3],[2,2],[3,1],[4,0]]
		];
		var marks = [];
		for (var i = 0; i < 10; i++) {
			marks[i] = [];
			for (var j = 0; j < 10; j++) {
				marks[i][j] = "";
			}
		}

// 盤面をクリックしたときの処理
		for (var i = 0; i < cells.length; i++) {
			cells[i].onclick = function() {
				if (this.innerHTML == "") {
					this.innerHTML = turn;
					var row = Number(this.parentNode.rowIndex);
					var col = Number(this.cellIndex);
					marks[row][col] = turn;
					if (checkWin(turn)) {
						result.innerHTML = turn + "の勝ち！";
						result.style.display = "block";
						disableBoard();
					} else if (checkDraw()) {
						result.innerHTML = "引き分け";
						result.style.display = "block";
						disableBoard();
					} else {
						switchTurn();
					}
				}
			}
		}

// 盤面を無効化する
		function disableBoard() {
			for (var i = 0; i < cells.length; i++) {
				cells[i].onclick = null;
			}
		}

// 勝利判定
		function checkWin(mark) {
			for (var i = 0; i < winningLines.length; i++) {
				var line = winningLines[i];
				var count = 0;
				for (var j = 0; j < line.length; j++) {
					var row = line[j][0];
					var col = line[j][1];
					if (marks[row][col] == mark) {
						count++;
						if (count == 5) {
							return true;
						}
					} else {
						break;
					}
				}
			}
			return false;
		}

// 引き分け判定
		function checkDraw() {
			for (var i = 0; i < marks.length; i++) {
				for (var j = 0; j < marks[i].length; j++) {
					if (marks[i][j] == "") {
						return false;
					}
				}
			}
			return true;
		}

// 手番を切り替える
		function switchTurn() {
			if (turn == "●") {
				turn = "×";
			} else {
				turn = "●";
			}
		}
	</script>
</body>
</html>

このプログラムにより、スマホで操作して遊べる⚪︎×ゲームが実装されました。絵文字を使用して、より楽しいゲーム体験を提供しています。