The storm is gone and its a beautiful sunny day for the game!'s game

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

No:4288

2568

←

Prev Next

→

The storm is gone and its a beautiful sunny day fo..ALL
Developer もちきなこ｜Date and time 23/6/27 19:04:08
Build time 74.789 sec｜Game capacity 1.711KB｜

Script

プレーヤーは画面上に表示される雲と太陽をタップして、雲を消し去り快晴日和を目指すゲームです。 HTMLファイル：

JavaScriptで、`addEventListener`を使ってクリックイベントを監視し、雲または太陽がタップされた時にそれぞれのスタイルを変更し、ゲームを進めます。画面左上の編集ボタンを押して、「プレビュー」を選択することで、ゲームをプレイできます。絵文字は使用していませんが、スマホでの操作に対応しています。

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

プレーヤーは画面上に表示される雲と太陽をタップして、雲を消し去り快晴日和を目指すゲームです。

HTMLファイル：

```
<!DOCTYPE html>
<html>
<head>
	<title>快晴日和なゲーム</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
	<div id="game">
		<div id="cloud"></div>
		<div id="sun"></div>
	</div>
	<script>
		// 雲をタップした時の処理
		document.getElementById("cloud").addEventListener("click", function() {
			this.style.display = "none";
			// 雲が消えたら太陽を表示
			document.getElementById("sun").style.display = "block";
		});
		// 太陽をタップした時の処理
		document.getElementById("sun").addEventListener("click", function() {
			this.style.display = "none";
			// ゲームクリアメッセージを表示
			alert("おめでとう！快晴日和だよ！");
		});
	</script>
	<style>
		body {
			text-align: center;
			font-size: 2em;
			margin-top: 20%;
		}
		#game {
			position: relative;
			width: 80%;
			margin: 0 auto;
			height: 60vh;
		}
		#cloud, #sun {
			position: absolute;
			top: 30%;
			left: 40%;
			font-size: 4em;
			cursor: pointer;
		}
		#sun {
			display: none;
		}
	</style>
</body>
</html>
```

JavaScriptで、`addEventListener`を使ってクリックイベントを監視し、雲または太陽がタップされた時にそれぞれのスタイルを変更し、ゲームを進めます。

画面左上の編集ボタンを押して、「プレビュー」を選択することで、ゲームをプレイできます。

絵文字は使用していませんが、スマホでの操作に対応しています。