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

No:1536

1948

←

Prev Next

→

Curry making game
Developer User3358｜Date and time 23/6/18 18:14:55
Build time 32.479 sec｜Game capacity 2.635KB｜

Script

カレーを作ろう！

材料を揃えて、美味しいカレーを作ろう！

肉

野菜

スパイス

このゲームでは、肉・野菜・スパイスの3つの材料が揃っている時に「カレーを作る！」ボタンを押すと、「おいしいカレーが出来ました！」と表示されます。揃っていない場合は「材料が足りません！」と表示されます。材料のチェックボックスには、それぞれ肉・野菜・スパイスの絵文字が表示されています。スマホで操作する場合にも使いやすいように、レイアウトもシンプルになるように工夫しました。

←

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: #FFE5B4;
			font-size: 1.2em;
			text-align: center;
		}
		img {
			max-height: 200px;
			max-width: 200px;
		}
		.container {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: center;
			margin: 20px;
		}
		.item {
			margin: 10px;
		}
		.button {
			padding: 10px;
			background-color: #FF7F50;
			color: white;
			border-radius: 5px;
			cursor: pointer;
		}
		#result {
			margin: 20px auto;
			font-size: 2em;
			font-weight: bold;
		}
	</style>
</head>
<body>
	<h1>カレーを作ろう！</h1>
	<p>材料を揃えて、美味しいカレーを作ろう！</p>

<button class="button" onclick="makeCurry()">カレーを作る！</button>

if (meat.checked && vegetables.checked && spices.checked) {
				document.getElementById('result').innerHTML = "おいしいカレーが出来ました！";
				document.body.style.backgroundColor = "#F08080";
			} else {
				document.getElementById('result').innerHTML = "材料が足りません！";
				document.body.style.backgroundColor = "#FFE5B4";
			}
		}
	</script>
</body>
</html>