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

No:2148

422

←

Prev Next

→

Battle of the Hub and the Mongoose
Developer User3500｜Date and time 23/6/20 8:55:13
Build time 28.359 sec｜Game capacity 2.37KB｜

Script

Battle of the Hub and the Mongoose

Choose who wins!

🐍

🦐

Game Overview: This game is、Anticipating a battle between the hub and the mongoose、It is a simple game where the winner is the one who chooses. The user is、Tap the screen with your phone.、Choose hub or mongoose and、Predict the winner. If your choice is the winner.、Show winners in pictograms and、It is displayed in red color. In case of a loss、It is displayed in blue.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>ハブとマングースの戦い</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			background-color: #f2f2f2;
			font-family: Arial, sans-serif;
			text-align: center;
			margin: 0;
			padding: 0;
		}
		h1 {
			margin-top: 50px;
			font-size: 3em;
		}
		p {
			font-size: 1.2em;
			margin-bottom: 20px;
		}
		.button {
			background-color: #4CAF50;
  			border: none;
  			color: white;
  			padding: 15px 50px;
  			text-align: center;
  			text-decoration: none;
			display: inline-block;
			font-size: 1.5em;
			margin: 20px;
			border-radius: 10px;
			cursor: pointer;
		}
		#playground {
			margin-top: 50px;
		}
		#hub, #mongoose {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			width: 100px;
			height: 100px;
			font-size: 4em;
			line-height: 100px;
			cursor: pointer;
		}
		#hub {
			background-color: #ffcc66;
			border-radius: 50%;
		}
		#mongoose {
			background-color: #6699ff;
			border-radius: 0 50% 50% 0;
			color: #fff;
		}
		#result {
			font-size: 3em;
			margin-top: 50px;
		}
	</style>
</head>
<body>
	<h1>ハブとマングースの戦い</h1>
	<p>誰が勝つか選んでください！</p>
	<div id="playground">
		<div id="hub">🐍</div>
		<div id="mongoose">🦐</div>
	</div>
	<div id="result"></div>
	<script>
		var result = document.getElementById("result");
		var hub = document.getElementById("hub");
		var mongoose = document.getElementById("mongoose");
		var winner = "";

hub.addEventListener("click", function(){
			winner = "ハブ";
			result.textContent = "勝者は" + winner + "!";
			result.style.color = "red";
		});
		mongoose.addEventListener("click", function(){
			winner = "マングース";
			result.textContent = "勝者は" + winner + "!";
			result.style.color = "blue";
		});
	</script>
</body>
</html>

ゲームの概要：

このゲームは、ハブとマングースの戦いを予想し、選んだ方が勝者となるシンプルなゲームです。ユーザーは、スマホで画面をタップして、ハブかマングースを選択し、勝者を予想します。選んだ方が勝った場合には、絵文字で勝者を表示し、赤い色で表示されます。負けた場合には、青い色で表示されます。