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

No:348

218

←

Prev Next

→

The worlds first aiki raising game
Developer User2983｜Date and time 23/6/12 18:24:33
Build time 37.597 sec｜Game capacity 3.156KB｜

Script

合気上げゲーム

30秒

0点

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>合気上げゲーム</title>
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
</head>
<body>
	<div id="container">
		<div id="game">
			<h1>合 気 上 げ ゲ ー ム</h1>
			<div id="timer">30秒</div>
			<div id="score">0点</div>
			<button id="start">スタート！</button>
		</div>
		<div id="result">
			<h2 id="resultText"></h2>
			<button id="retry">もう一度！</button>
		</div>
	</div>
	<script>
		// 合気上げゲーム
		const emojis = ["🥋", "🧘‍♂️", "🤸‍♂️", "🏋️‍♂️", "🏊‍♂️"];
		const gameDiv = document.getElementById("game");
		const resultDiv = document.getElementById("result");
		let score = 0;
		let timer = null;

function getRandomEmoji() {
			return emojis[Math.floor(Math.random() * emojis.length)];
		}

function updateScore() {
			const scoreDiv = document.getElementById("score");
			scoreDiv.innerHTML = `${score}点`;
		}

function startGame() {
			score = 0;
			updateScore();
			const startButton = document.getElementById("start");
			startButton.style.display = "none";
			gameDiv.style.display = "block";
			resultDiv.style.display = "none";
			const timerDiv = document.getElementById("timer");
			timerDiv.innerHTML = "30秒";
			timer = setInterval(updateTimer, 1000);
			const gameContent = document.createElement("div");
			gameContent.innerHTML = getRandomEmoji();
			gameContent.addEventListener("click", function() {
				score += 10;
				updateScore();
				gameContent.innerHTML = getRandomEmoji();
			});
			gameDiv.appendChild(gameContent);
		}

const startButton = document.getElementById("start");
		startButton.addEventListener("click", startGame);

const retryButton = document.getElementById("retry");
		retryButton.addEventListener("click", startGame);

</script>
	<style>
		body {
			text-align: center;
			font-size: 3rem;
			margin: 0;
			padding: 0;
		}

#container {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			height: 100vh;
			background-color: lightgreen;
		}

#game, #result {
			display: none;
			margin: 1rem;
			padding: 1rem;
			background-color: white;
			border-radius: 1rem;
			box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.3);
		}

#timer, #score {
			font-size: 2rem;
			margin: 1rem;
		}

button {
			font-size: 2rem;
			border: none;
			background-color: lightblue;
			padding: 0.5rem 1rem;
			border-radius: 0.5rem;
			box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.2);
			cursor: pointer;
			outline: none;
		}

button:hover {
			background-color: lightcyan;
		}
	</style>
</body>
</html>

合 気 上 げ ゲ ー ム

合気上げゲーム