Hurry up with the update of the SacraSchool simulator!!!! Im not sure if its 🤬💢game's game

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

No:4313

1017

←

Prev Next

→

Hurry up with the update of the SacraSchool simula..ALL
Developer どうスクのアプデ早くしろよ！🤬💢｜Date and time 23/6/27 19:34:44
Build time 30.572 sec｜Game capacity 3.251KB｜

Script

わかりました。以下のようにゲームを作成してみました。

100%

このゲームはスマホのバッテリーをシミュレートしたもので、消費ボタンと充電ボタンがあります。消費ボタンを押すとバッテリーの残量が減り、充電ボタンを押すとバッテリーの残量が増えます。バッテリーが0になるとゲームオーバーになり、もう一度遊ぶためのボタンが表示されます。また、スタートボタンを押すとバッテリーが100%になり、ゲームが再開されます。

←

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">
	<style>
		body {
			background-color: #f1f1f1;
		}

#battery-bar {
			background-color: #4CAF50;
			height: 30px;
			width: 100%;
			max-width: 100%;
			margin-bottom: 20px;
		}

#battery-percentage {
			font-size: 20px;
			font-weight: bold;
			color: white;
			text-align: center;
			line-height: 30px;
		}

#play-again-button {
			display: none;
			background-color: #008CBA;
			color: white;
			border: none;
			padding: 10px;
			text-align: center;
			text-decoration: none;
			font-size: 16px;
			margin-top: 20px;
			cursor: pointer;
			border-radius: 5px;
		}
	</style>
</head>
<body>
	<div id="battery-bar">
		<div id="battery-percentage">100%</div>
	</div>
	<button id="drain-button">消費する</button>
	<button id="charge-button">充電する</button>
	<button id="start-button" style="display: none;">スタート！</button>
	<button id="play-again-button">もう一度遊ぶ！</button>
	<script>
		let battery = 100;
		let interval;
		function drainBattery() {
			if (battery > 0) {
				battery--;
				document.getElementById("battery-bar").style.width = battery + "%";
				document.getElementById("battery-percentage").innerHTML = battery + "%";
			}
			if (battery <= 0) {
				clearInterval(interval);
				document.getElementById("drain-button").disabled = true;
				document.getElementById("start-button").style.display = "initial";
			}
		}
		function chargeBattery() {
			if (battery < 100) {
				battery++;
				document.getElementById("battery-bar").style.width = battery + "%";
				document.getElementById("battery-percentage").innerHTML = battery + "%";
			}
		}
		document.getElementById("drain-button").addEventListener("click", function() {
			if (battery > 0) {
				clearInterval(interval);
				interval = setInterval(drainBattery, 1000);
			}
		});
		document.getElementById("charge-button").addEventListener("click", function() {
			if (battery < 100) {
				clearInterval(interval);
				interval = setInterval(chargeBattery, 1000);
			}
		});
		document.getElementById("start-button").addEventListener("click", function() {
			battery = 100;
			document.getElementById("battery-bar").style.width = battery + "%";
			document.getElementById("battery-percentage").innerHTML = battery + "%";
			document.getElementById("drain-button").disabled = false;
			document.getElementById("start-button").style.display = "none";
			document.getElementById("play-again-button").style.display = "none";
		});
		setInterval(drainBattery, 1000);
	</script>
</body>
</html>