カセキホリダー画面をタップして、岩を崩していきます。岩の中には化石が隠れています。化石を綺麗に取り出しましょう！'s game

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

No:3106

4800

←

Prev Next

→

カセキホリダー画面をタップして、岩を崩していきます。岩の中には化石が隠れています。化石を綺麗に取..ALL
Developer anonymous｜Date and time 23/8/14 16:22:41
Build time unknown sec｜Game capacity 2.411KB｜

Script

←

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: #87CEFA;
		}
		.container {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
			height: 100vh;
		}
		.box {
			box-sizing: border-box;
			margin: 5px;
			padding: 10px;
			background-color: #FFF;
			border-radius: 10px;
			width: calc(100% / 3 - 10px);
			text-align: center;
			font-size: 5vw;
			color: #FF8C00;
			cursor: pointer;
		}
		.hidden {
			display: none;			
		}
		.popup {
			position: fixed;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			padding: 20px;
			background-color: #FFF;
			border-radius: 10px;
			width: 90%;
			text-align: center;
			font-size: 7vw;
			color: #FF8C00;
			z-index: 999;
			display: none;
		}
		.popup.show {
			display: block;
		}
		.popup p {
			margin-top: 0;
			font-weight: bold;
			font-size: 5vw;
		}
		.popup img {
			max-width: 80%;
			margin-top: 20px;
		}
	</style>
</head>
<body>
	<div class="container"></div>
	<div class="popup"></div>
	<script>
		const fossils = ['🦖','🦕','🐊','🐍','🦈','🐟','🐚','🕸️','💀'];
		const container = document.querySelector(".container");
		const popup = document.querySelector(".popup");
		let score = 0;
		
		function createBox() {
			container.innerHTML = "";
			for (let i = 0; i < 9; i++) {
				let box = document.createElement("div");
				box.classList.add("box");
				box.innerText = "💣";
				box.addEventListener("click", function() {
					let random = Math.floor(Math.random() * fossils.length);
					let result = fossils[random];
					if (result === "💀") {
						popup.innerHTML = "<p>GameOver</p><img src='https://media.giphy.com/media/1zKinet3IPIZK/giphy.gif'>";
						popup.classList.add("show");
						setTimeout(function() {
							popup.classList.remove("show");
							score = 0;
						}, 3000);
					} else {
						this.innerText = result;
						score++;
						if (score === 8) {
							popup.innerHTML = "<p>Congratulations!!</p><img src='https://media.giphy.com/media/A3xATzZhD2L4s/giphy.gif'>";
							popup.classList.add("show");
							setTimeout(function() {
								popup.classList.remove("show");
								score = 0;
							}, 3000);
						}
					}
				});
				container.appendChild(box);
			}
		}
		
		createBox();
	</script>
</body>
</html>