AI game creator

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

No:2770

1281

←

Prev Next

→

boil water
Developer User3494｜Date and time 23/6/22 16:44:24
Build time 18.156 sec｜Game capacity 1.855KB｜

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 type="text/css">
		body {
			font-size: 3em;
			text-align: center;
			margin-top: 10%;
		}
		button {
			padding: 1em 2em;
			font-size: 0.5em;
			background-color: #FFCC33;
			border-radius: 10px;
			border: none;
			margin: 0 5px;
			cursor: pointer;
		}
	</style>
	<script type="text/javascript">
		// お湯を沸かす
		let hotWater = false;

// 水を注ぐ
		function pourWater() {
			document.getElementById("message").innerHTML = "🌊🌊🌊";
			setTimeout(function() {
				document.getElementById("message").innerHTML = "💦💦💦";
			}, 2000);
		}

// お湯を沸かす
		function boilWater() {
			if (hotWater == false) {
				document.getElementById("message").innerHTML = "🔥🔥🔥";
				setTimeout(function() {
					document.getElementById("message").innerHTML = "🌡️🌡️🌡️";
					hotWater = true;
				}, 3000);
			} else {
				document.getElementById("message").innerHTML = "🌡️🌡️🌡️";
			}
		}
	</script>
</head>
<body>
	<div id="message">お湯を用意してください。</div>
	<button onclick="pourWater()">水を注ぐ</button>
	<button onclick="boilWater()">お湯を沸かす</button>
</body>
</html>