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

No:2673

2328

←

Prev Next

→

Voting Game Choose your favorite ride! Choose one ..ALL
Developer User3601｜Date and time 23/6/22 9:35:41
Build time 31.263 sec｜Game capacity 2.85KB｜

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 {
			font-family: Arial, sans-serif;
			text-align: center;
		}
		h1 {
			font-size: 36px;
			margin-top: 50px;
		}
		button {
			width: 120px;
			height: 120px;
			margin: 20px;
			background-color: #ffffff;
			border: 5px solid #000000;
			border-radius: 50%;
			font-size: 24px;
		}
		#result {
			margin: 50px;
			font-size: 48px;
			padding: 20px;
			background-color: #ffcc00;
			border: 10px solid #000000;
			border-radius: 20px;
		}
	</style>
</head>
<body>
	<h1>好きな乗り物を選ぼう！</h1>
	<button id="car">🚗</button>
	<button id="train">🚆</button>
	<button id="plane">✈</button>
	<button id="ship">🚢</button>
	<button id="bike">🚲</button>
	<div id="result"></div>
	<script>
		var vehicles = ["car", "train", "plane", "ship", "bike"];
		var winner = null;
		var isPlaying = false;
		
		function playGame() {
			if(!isPlaying) {
				isPlaying = true;
				var randomIndex = Math.floor(Math.random() * vehicles.length);
				winner = vehicles[randomIndex];
				var buttons = document.getElementsByTagName("button");
				for(var i = 0; i < buttons.length; i++) {
					buttons[i].disabled = true;
				}
				setTimeout(function() {
					for(var i = 0; i < buttons.length; i++) {
						buttons[i].disabled = false;
					}
					isPlaying = false;
					showResult();
				}, 5000);
			}
		}
		
		function showResult() {
			var resultDiv = document.getElementById("result");
			resultDiv.innerHTML = "🏆 " + winner + " wins! 🏆";
			switch(winner) {
				case "car":
					resultDiv.style.backgroundColor = "#ff0000";
					break;
				case "train":
					resultDiv.style.backgroundColor = "#00ff00";
					break;
				case "plane":
					resultDiv.style.backgroundColor = "#0000ff";
					break;
				case "ship":
					resultDiv.style.backgroundColor = "#ffff00";
					break;
				case "bike":
					resultDiv.style.backgroundColor = "#ff00ff";
					break;
			}
		}
		
		document.getElementById("car").addEventListener("click", function() {
			if(!isPlaying) {
				winner = "car";
				showResult();
			}
		});
		document.getElementById("train").addEventListener("click", function() {
			if(!isPlaying) {
				winner = "train";
				showResult();
			}
		});
		document.getElementById("plane").addEventListener("click", function() {
			if(!isPlaying) {
				winner = "plane";
				showResult();
			}
		});
		document.getElementById("ship").addEventListener("click", function() {
			if(!isPlaying) {
				winner = "ship";
				showResult();
			}
		});
		document.getElementById("bike").addEventListener("click", function() {
			if(!isPlaying) {
				winner = "bike";
				showResult();
			}
		});
		
		setInterval(function() {
			if(!isPlaying) {
				playGame();
			}
		}, 10000);
	</script>
</body>
</html>