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

No:545

259

←

Prev Next

→

Car engine simulator
Developer User3044｜Date and time 23/6/15 12:54:01
Build time 35.179 sec｜Game capacity 2.342KB｜

Script

車のエンジンシミュレーター

OFF

このエンジンシミュレーターは、スタートボタンを押すと、"ON"という文字が表示され、エンジンが始まります。エンジンが始まるたびに、車のアイコンが表示され、エンジンが回る様子が表現されます。ただし、エンジンが30回回転すると、エンジンが壊れて、"エンジンが壊れました💔"という文字が表示され、エンジンが止まります。ストップボタンを押すと、"OFF"という文字が表示され、エンジンが止まります。なお、このエンジンシミュレーターは、スマホでも操作が可能です。また、絵文字が多用されているため、可愛らしい印象を与えます。

←

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: #F9E79F;
			font-size: 2em;
			text-align: center;
		}
		
		#engine {
			font-size: 4em;
			margin-bottom: 0.5em;
		}
		
		button {
			background-color: #BB8FCE;
			border: none;
			color: white;
			font-size: 1em;
			padding: 0.5em;
			margin: 0.5em;
			border-radius: 0.3em;
			cursor: pointer;
		}
	</style>
</head>
<body>
	<h1>車のエンジンシミュレーター</h1>
	
	<div id="engine">OFF</div>
	<button id="startButton">スタート</button>
	<button id="stopButton">ストップ</button>
	
	<script>
		var engine = document.getElementById("engine");
		var startButton = document.getElementById("startButton");
		var stopButton = document.getElementById("stopButton");
		var intervalId;
		var count = 0;
		
		startButton.addEventListener("click", function() {
			engine.innerHTML = "ON";
			intervalId = setInterval(runEngine, 100);
		});
		
		stopButton.addEventListener("click", function() {
			engine.innerHTML = "OFF";
			clearInterval(intervalId);
			count = 0;
		});
		
		function runEngine() {
			if (count % 10 == 0) {
				engine.innerHTML += "💥";
			} else if (count % 5 == 0) {
				engine.innerHTML += "🔥";
			} else {
				engine.innerHTML += "🚗";
			}
			
			if (count > 30) {
				engine.innerHTML = "エンジンが壊れました💔";
				clearInterval(intervalId);
				count = 0;
			} else {
				count++;
			}
		}
	</script>
</body>
</html>