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

No:43

346

←

Prev Next

→

simulation game
Developer anonymous｜Date and time 23/5/5 2:26:17
Build time 55.811 sec｜Game capacity 2.504KB｜

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>
		body{
			font-family: Arial, sans-serif;
			background-color: #f8f8f8;
		}
		h1{
			text-align: center;
			color: #4e4e4e;
		}
		.container{
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
			margin-top: 50px;
		}
		.button{
			width: 200px;
			height: 60px;
			font-size: 24px;
			color: #fff;
			background-color: #4e4e4e;
			border: none;
			border-radius: 10px;
			margin: 10px;
			cursor: pointer;
		}
		.button:hover{
			background-color: #6e6e6e;
		}
		.box{
			width: 400px;
			height: 400px;
			margin: auto;
			border-radius: 10px;
			background-color: #e4e4e4;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			text-align: center;
		}
		.box p{
			font-size: 48px;
			color: #4e4e4e;
		}
		.box button{
			width: 200px;
			height: 60px;
			font-size: 24px;
			color: #fff;
			background-color: #4e4e4e;
			border: none;
			border-radius: 10px;
			margin-top: 40px;
			cursor: pointer;
		}
		.box button:hover{
			background-color: #6e6e6e;
		}
	</style>
</head>
<body>
	<h1>シミュレーションゲーム</h1>
	<div class="container">
		<button class="button" onclick="startGame()">ゲームスタート</button>
	</div>
	<div class="box" style="display:none;">
		<p id="number">0</p>
		<button onclick="addNumber()">数字を増やす</button>
		<button onclick="minusNumber()">数字を減らす</button>
		<button onclick="resetGame()">やり直す</button>
	</div>
	<script>
		var number = 0;

function startGame(){
			document.querySelector('.container').style.display = "none";
			document.querySelector('.box').style.display = "block";
			document.querySelector('#number').innerHTML = number;
		}

function addNumber(){
			number++;
			document.querySelector('#number').innerHTML = number;
		}

function minusNumber(){
			number--;
			document.querySelector('#number').innerHTML = number;
		}

function resetGame(){
			number = 0;
			document.querySelector('#number').innerHTML = number;
		}
	</script>
</body>
</html>