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

No:246

232

←

Prev Next

→

See the Northern Lights
Developer User2983｜Date and time 23/6/11 10:20:26
Build time 16.455 sec｜Game capacity 1.599KB｜

Script

オーロラを見よう！

このアプリは「オーロラを見る」というゲームで、ユーザーが「オーロラを見る」ボタンを押すと、実際のオーロラの画像が表示されます。また、「オーロラを見ることができました！🌌」というメッセージが表示されます。スマホでも操作可能で、ユーザーにとってわかりやすく、絵文字を多く使用しています。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>オーロラを見る</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			background-color: black;
			color: white;
		}
		h1 {
			text-align: center;
			font-size: 40px;
			margin-top: 20%;
		}
		#button {
			display: block;
			margin: 0 auto;
			margin-top: 30px;
			padding: 10px 20px;
			font-size: 30px;
			background-color: #1abc9c;
			border: none;
			border-radius: 5px;
			color: white;
			cursor: pointer;
		}
	</style>
	<script>
		window.onload = function() {
			document.getElementById('button').addEventListener('click', function() {
				// オーロラを表示する
				document.body.style.backgroundImage = "url('https://www.photocase.com/photos/2538456-northern-lights-aurora-borealis-northern-lights-photocase-stock-photo-medium.jpg')"
				// メッセージを表示する
				document.getElementById('message').innerHTML = "オーロラを見ることができました！🌌"
			});
		}
	</script>
</head>
<body>
	<h1>オーロラを見よう！</h1>
	<button id="button">オーロラを見る</button>
	<p id="message"></p>
</body>
</html>