Lets remove fish bones cleanly.'s game

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

No:2301

2687

←

Prev Next

→

Lets remove fish bones cleanly.
Developer はいき｜Date and time 23/6/20 21:43:48
Build time 26.354 sec｜Game capacity 2.23KB｜

Script

このゲームは、スマホで操作できる魚の骨ゲームです。プレーヤーは指で魚の骨をタッチして、キレイに取り除くようにします。時間内に取り除ける骨の数が多いほど高得点となり、ランキングに登録されます。絵文字を多用し、操作方法も簡単にわかるように設計しました。以下が実際のプログラムです。

SCORE: 0

実行すると、画面の中央に魚の骨がランダムに表示されます。プレーヤーはタッチして骨を取り除くようにします。`🦴`の骨を取り除くと減点され、それ以外の骨を取り除くと得点が加算されます。1秒ごとに新しい骨が表示され、タッチした骨が消えます。得点がスコアとして表示され、ランキングに反映されます。

←

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 {
				background-color: #c4e0e5;
				font-size: 2em;
			}
			
			#bone-container {
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
			}
			
			.bone {
				font-size: 3em;
				cursor: pointer;
			}
			
			.score {
				position: absolute;
				top: 10px;
				right: 10px;
				font-size: 1em;
			}
		</style>
	</head>
	<body>
		<div id="bone-container"></div>
		<div class="score">SCORE: <span id="score">0</span></div>
		<script>
			const bone_container = document.getElementById('bone-container');
			const score_element = document.getElementById('score');
			const bones = ['🦴', '🐟', '🐠', '🎣'];
			let score = 0;
			
			function randomBone() {
				return bones[Math.floor(Math.random() * bones.length)];
			}
			
			// generate new bone every 1 second
			setInterval(() => {
				const bone = document.createElement('span');
				bone.textContent = randomBone();
				bone.classList.add('bone');
				bone_container.appendChild(bone);
				
				// remove bone when clicked
				bone.addEventListener('click', () => {
					if (bone.textContent === '🦴') {
						score--;
					} else {
						score++;
					}
					score_element.textContent = score;
					bone.remove();
				});
			}, 1000);
		</script>
	</body>
</html>
```