Satellites orbiting the earth's game

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

No:3453

3659

←

Prev Next

→

Satellites orbiting the earth
Developer User3707｜Date and time 23/6/25 5:33:00
Build time 24.808 sec｜Game capacity 2.254KB｜

Script

得点: 0

←

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: black;
			color: white;
			font-family: Arial;
		}

#satellite {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translateX(-50%) translateY(-50%);
			width: 50px;
			height: 50px;
			background-image: url('https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/240/apple/285/satellite_1f6f0.png');
			background-size: contain;
			background-repeat: no-repeat;
		}

#score {
			position: absolute;
			top: 10px;
			right: 10px;
			font-size: 24px;
			font-weight: bold;
		}
	</style>
</head>
<body>
	<div id="satellite"></div>
	<div id="score">得点: 0</div>

// 衛星をランダムな位置に移動
		function moveSatellite() {
			const left = Math.floor(Math.random() * bounds.right);
			const top = Math.floor(Math.random() * bounds.bottom);
			satellite.style.left = left + 'px';
			satellite.style.top = top + 'px';
		}

// 衛星をクリックした時の処理
		function increaseScore() {
			score++;
			document.getElementById('score').innerText = '得点: ' + score;
			moveSatellite();
		}

// 衛星が画面の外に出た時の処理
		function satelliteOutOfBounds() {
			alert('衛星が外れてしまいました。最終得点: ' + score);
			location.reload();
		}

// スマホのタッチ操作に対応
		satellite.addEventListener('touchmove', function(e) {
			e.preventDefault();
			const x = e.touches[0].clientX - satellite.offsetWidth / 2;
			const y = e.touches[0].clientY - satellite.offsetHeight / 2;
			if (x < bounds.left || x > bounds.right || y < bounds.top || y > bounds.bottom) {
				satelliteOutOfBounds();
			} else {
				satellite.style.left = x + 'px';
				satellite.style.top = y + 'px';
			}
		});

// 初回衛星の移動
		moveSatellite();

// 衛星をクリックした時に得点を加算
		satellite.addEventListener('click', increaseScore);
	</script>
</body>
</html>