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

No:1124

126

←

Prev Next

→

Tap count
Developer User3251｜Date and time 23/6/18 3:51:08
Build time 27.966 sec｜Game capacity 2KB｜

Script

Create a game that competes for the

Tap Count Game

30 seconds remaining

This game is to tap as many taps as possible within a time limit of 30 seconds. You can also play it on your mobile phone.、Buttons are made larger. Emojis are not used.、Use a bright red background color and button color.、The design is simple and cute.

←

Prev　Next

→ 　

Back　

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

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

を競うゲームを作ります。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>タップゲーム</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #eee;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			height: 100vh;
		}

#count {
			font-size: 5rem;
			color: #333;
			margin: 1rem 0;
		}

button {
			border: none;
			outline: none;
			background-color: #ff6b6b;
			color: #fff;
			padding: 1rem 2rem;
			border-radius: 5px;
			font-size: 2rem;
			cursor: pointer;
		}

button:hover {
			background-color: #ff5252;
		}
	</style>
	<script>
		// 初期値を設定
		let count = 0;

// カウントアップする関数
		function tap() {
			count++;
			// ボタンのテキストを更新
			document.getElementById('btn').textContent = `タップ！（${count}回）`;
		}

// 制限時間を設定
		const limit = 30;

// 残り時間を表示する関数
		function showTime() {
			document.getElementById('time').textContent = `残り${limit}秒`;
			// 残り時間が0秒になったらゲーム終了
			if (limit === 0) {
				clearInterval(intervalId);
				document.getElementById('btn').removeEventListener('click', tap);
				alert(`時間切れ！あなたのタップ回数は${count}回でした！`);
			} else {
				limit--;
			}
		}

// 1秒ごとに残り時間を更新
		const intervalId = setInterval(showTime, 1000);
	</script>
</head>
<body>
	<h1>タップ回数ゲーム</h1>
	<p id="count">0</p>
	<p id="time">残り30秒</p>
	<button id="btn" onclick="tap()">タップ！</button>
</body>
</html>

このゲームは制限時間30秒の間にできるだけたくさんタップするゲームです。スマホでも遊べるように、ボタンは大きめに作ってあります。絵文字は使用していませんが、背景色やボタンの色を明るい赤色にして、シンプルで可愛らしいデザインに仕上げました。