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

No:6166

2423

←

Prev Next

→

Mixed drink bar! Press the buttons with the names ..ALL
Developer User3720｜Date and time 23/7/1 18:18:52
Build time 34.134 sec｜Game capacity 2.925KB｜

Script

混ぜ混ぜドリンクバー

五種類のジュースの名前のボタンを押してコップにジュースを注ごう！

コップにはボタン3回分のジュースしか入らないぞ！

3回以上ボタンを押すとジュースがこぼれてゲームオーバー！

ボタンを一回以上押して完成ボタンを押すとゲームクリア！

ボタンを一回も押さずに完成ボタンを押すとゲームオーバー！

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>混ぜ混ぜドリンクバー</title>
	<style>
		body {
			text-align: center;
		}

button {
			width: 150px;
			height: 50px;
			margin-bottom: 10px;
		}

#cup {
			width: 180px;
			height: 200px;
			border: 2px solid black;
			margin: 20px auto;
			padding-top: 20px;
		}
	</style>
</head>
<body>
	<h1>混ぜ混ぜドリンクバー</h1>
	<p>五種類のジュースの名前のボタンを押してコップにジュースを注ごう！</p>
	<p>コップにはボタン3回分のジュースしか入らないぞ！</p>
	<p>3回以上ボタンを押すとジュースがこぼれてゲームオーバー！</p>
	<p>ボタンを一回以上押して完成ボタンを押すとゲームクリア！</p>
	<p>ボタンを一回も押さずに完成ボタンを押すとゲームオーバー！</p>
	<div id="cup"></div>
	<button id="orangeButton">オレンジジュース</button>
	<button id="appleButton">りんごジュース</button>
	<button id="grapeButton">ぶどうジュース</button>
	<button id="melonButton">メロンジュース</button>
	<button id="mangoButton">マンゴージュース</button>
	<button id="finishButton">完成</button>

const orangeButton = document.getElementById("orangeButton");
		orangeButton.addEventListener("click", addJuiceToCup);

const appleButton = document.getElementById("appleButton");
		appleButton.addEventListener("click", addJuiceToCup);

const grapeButton = document.getElementById("grapeButton");
		grapeButton.addEventListener("click", addJuiceToCup);

const melonButton = document.getElementById("melonButton");
		melonButton.addEventListener("click", addJuiceToCup);

const mangoButton = document.getElementById("mangoButton");
		mangoButton.addEventListener("click", addJuiceToCup);

const finishButton = document.getElementById("finishButton");
		finishButton.addEventListener("click", checkGameResult);

function addJuiceToCup() {
			if (cupJuiceCount >= 3) {
				gameOver();
				return;
			}
			cupJuiceCount++;
			document.getElementById("cup").textContent = "ジュースの量: " + cupJuiceCount;
		}

function checkGameResult() {
			if (cupJuiceCount >= 1 && cupJuiceCount <= 2) {
				gameOver();
				return;
			}
			if (cupJuiceCount === 3) {
				gameClear();
			}
		}

function gameClear() {
			document.getElementById("cup").textContent = "ジュースの量: " + cupJuiceCount + " - ゲームクリア！";
			disableButtons();
		}

function gameOver() {
			document.getElementById("cup").textContent = "ジュースの量: " + cupJuiceCount + " - ゲームオーバー！";
			disableButtons();
		}

function disableButtons() {
			orangeButton.disabled = true;
			appleButton.disabled = true;
			grapeButton.disabled = true;
			melonButton.disabled = true;
			mangoButton.disabled = true;
			finishButton.disabled = true;
		}
	</script>
</body>
</html>