ライオン🦁ガツンとマシマシゲーム

遊び方

画面をタップすると、ライオンが前進します。走る速度を上げるために何度かタップしてください。

画面の左右には迫りくる敵がいます。敵にぶつかるとゲームオーバーです。

できるだけ長く、敵に接触しないように走り続けましょう。

Score: 0

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>Lion Game</title>
</head>
<body>

<h1>ライオン🦁ガツンとマシマシゲーム</h1>

<h2>遊び方</h2>
	<p>画面をタップすると、ライオンが前進します。走る速度を上げるために何度かタップしてください。</p>
	<p>画面の左右には迫りくる敵がいます。敵にぶつかるとゲームオーバーです。</p>
	<p>できるだけ長く、敵に接触しないように走り続けましょう。</p>

<p id="score">Score: 0</p>

document.addEventListener("click", function() {
			lion.style.left = parseInt(lion.style.left, 10) + 10 + "px";
			score++;
			document.getElementById("score").textContent = "Score: " + score;
		});

setInterval(function() {
			var enemies = document.querySelectorAll("kbd");
			for (var i = 0; i < enemies.length; i++) {
				var enemy = enemies[i];
				enemy.style.left = parseInt(enemy.style.left, 10) - 10 + "px";
				if (isColliding(lion, enemy)) {
					alert("Game Over");
					location.reload();
				} else if (enemy.style.left == "0px") {
					score++;
				}
			}
			var enemy = document.createElement("kbd");
			enemy.textContent = "💣";
			enemy.style.fontSize = "50px";
			enemy.style.position = "absolute";
			enemy.style.top = Math.floor(Math.random()*80) + "%";
			enemy.style.left = "100%";
			document.body.appendChild(enemy);
		}, 100);

function isColliding(el1, el2) {
			var rect1 = el1.getBoundingClientRect();
			var rect2 = el2.getBoundingClientRect();
			return !(rect1.right < rect2.left || 
					 rect1.left > rect2.right || 
					 rect1.bottom < rect2.top || 
					 rect1.top > rect2.bottom)
		}
	</script>

</body>
</html>