The game of putting Mentos in Coke and overflowing it's game

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

No:1465

123

←

Prev Next

→

The game of putting Mentos in Coke and overflowing..ALL
Developer sayaensm｜Date and time 23/6/18 16:56:05
Build time 16.638 sec｜Game capacity 1.45KB｜

Script

※cola.pngとmentos.pngは実際に用意した画像ファイルを使用してください。 ※ゲーム概要: 画面上に表示されたメントスをクリックすると、コーラのビンにメントスが入り、コーラがあふれ出すゲームです。コーラがあふれ出るまでの時間を競い、ゲームオーバー後はリロードして再挑戦できます。

←

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>Mentos and Cola Game</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			font-size: 2rem;
			text-align: center;
		}
		#cola {
			width: 100%;
			height: 100%;
			background-image: url("cola.png");
			background-size: cover;
			position: absolute;
			top: 0;
			left: 0;
			z-index: -1;
		}
		#mentos {
			width: 10vw;
			height: 10vw;
			background-image: url("mentos.png");
			background-size: contain;
			background-repeat: no-repeat;
			position: absolute;
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			cursor: pointer;
		}
	</style>
</head>
<body>
	<div id="cola"></div>
	<div id="mentos"></div>
	<script>
		let mentos = document.querySelector("#mentos");
		mentos.addEventListener("click", function() {
			mentos.style.display = "none";
			document.querySelector("#cola").style.animation = "pour 3s ease-out forwards";
			setTimeout(function() {
				alert("Game Over! The cola overflowed!");
				location.reload();
			}, 3000);
		});
	</script>
</body>
</html>

※cola.pngとmentos.pngは実際に用意した画像ファイルを使用してください。

※ゲーム概要: 画面上に表示されたメントスをクリックすると、コーラのビンにメントスが入り、コーラがあふれ出すゲームです。コーラがあふれ出るまでの時間を競い、ゲームオーバー後はリロードして再挑戦できます。