回転寿司ゲームレールの上を寿司が走っています。指定されたお寿司をタップで取りましょう！'s game

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

No:3120

895

←

Prev Next

→

回転寿司ゲームレールの上を寿司が走っています。指定されたお寿司をタップで取りましょう！
Developer もちきなこ｜Date and time 23/6/23 22:07:38
Build time 31.087 sec｜Game capacity 2.405KB｜

Script

←

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 {
			background-color: #FFCC99;
		}
		#rail {
			margin: 0 auto;
			height: 200px;
			overflow: hidden;
			position: relative;
		}
		.sushi {
			position: absolute;
			top: 50px;
			width: 50px;
			height: 50px;
			border-radius: 50%;
			background-color: #FF6666;
			color: #FFFFFF;
			font-size: 24px;
			text-align: center;
			line-height: 50px;
			cursor: pointer;
		}
		#score {
			margin-top: 20px;
			text-align: center;
			font-size: 36px;
			color: #FFFFFF;
		}
	</style>
</head>
<body>
	<div id="rail"></div>
	<div id="score">0</div>
	<script>
		// 寿司の種類
		var sushiTypes = ["🍣", "🍱", "🍙", "🍘", "🍥", "🍢", "🍡", "🍧", "🍨", "🎂", "🍰", "🧁", "🍮", "🍩", "🍪"];
		// 寿司のレールを表す配列
		var rail = [];
		// 現在のスコア
		var score = 0;
		// スコアを表示する要素
		var scoreElem = document.querySelector("#score");
		// スコアを更新する関数
		function updateScore() {
			score++;
			scoreElem.textContent = score;
		}
		// 寿司を生成する関数
		function createSushi() {
			var sushiType = sushiTypes[Math.floor(Math.random() * sushiTypes.length)];
			var sushiElem = document.createElement("div");
			sushiElem.classList.add("sushi");
			sushiElem.textContent = sushiType;
			sushiElem.addEventListener("click", function() {
				if (sushiElem.textContent === rail[2].textContent) {
					rail[2].removeChild(sushiElem);
					updateScore();
				}
			});
			return sushiElem;
		}
		// 寿司をレールに設置する関数
		function placeSushi() {
			var sushiElem = createSushi();
			rail[0].appendChild(sushiElem);
			rail.splice(0, 0, sushiElem);
			rail[5].addEventListener("transitionend", function() {
				rail[5].removeChild(rail[5].firstChild);
				rail.pop();
				placeSushi();
			});
		}
		// レールを初期化する関数
		function initRail() {
			for (var i = 0; i < 6; i++) {
				var railElem = document.createElement("div");
				railElem.style.top = i * 50 + "px";
				document.querySelector("#rail").appendChild(railElem);
				rail.push(railElem);
			}
		}
		// レールを開始する関数
		function startRail() {
			placeSushi();
			setInterval(placeSushi, 3000);
		}
		// レールを初期化して開始する
		initRail();
		startRail();
	</script>
</body>
</html>