開発者ひさしをアップデートさせるゲーム

開発者ひさしは古いバージョンのアプリを使っています。

あなたは彼をアップデートさせることができます。

しかし、ひさしはアップデートを嫌がっています。

炎上している会社の名前を入力してください。

←

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 {
			font-family: sans-serif;
			text-align: center;
		}
		h1 {
			font-size: 3em;
			margin-bottom: 0.5em;
		}
		button {
			font-size: 2em;
			padding: 0.5em 1em;
			margin: 0.5em;
			background-color: #4CAF50;
			color: white;
			border: none;
			border-radius: 0.5em;
		}
		button:hover {
			background-color: #3E8E41;
		}
	</style>
	<script>
		document.addEventListener("DOMContentLoaded", function() {
			var updateButton = document.getElementById("updateButton");
			var progressBar = document.getElementById("progressBar");
			var progressText = document.getElementById("progressText");
			var count = 0;
			updateButton.addEventListener("click", function() {
				updateButton.disabled = true;
				progressBar.value = 0;
				progressText.innerText = "0%";
				var interval = setInterval(function() {
					if (count < 100) {
						count++;
						progressBar.value = count;
						progressText.innerText = count + "%";
					} else {
						clearInterval(interval);
						updateButton.disabled = false;
						alert("アップデートが完了しました！");
					}
				}, 50);
			});
		});
	</script>
</head>
<body>
	<h1>開発者ひさしをアップデートさせるゲーム</h1>
	<p>開発者ひさしは古いバージョンのアプリを使っています。</p>
	<p>あなたは彼をアップデートさせることができます。</p>
	<p>しかし、ひさしはアップデートを嫌がっています。</p>
	<p>炎上している会社の名前を入力してください。</p>
	<input type="text" id="companyName"><br>
	<button id="updateButton">アップデートする！</button><br>
	<progress id="progressBar" value="0" max="100"></progress><br>
	<span id="progressText">0%</span>
</body>
</html>