Avoiding the Honnoji Incident game's game

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

No:1425

113

←

Prev Next

→

Avoiding the Honnoji Incident game
Developer User3025｜Date and time 23/6/18 15:42:31
Build time 30.683 sec｜Game capacity 2.805KB｜

Script

😃

【ゲームの概要】プレイヤーの顔文字を操作し、画面にランダムに現れる敵キャラクターを避け続けるゲームです。敵キャラクターに衝突するとゲームオーバーになります。ゲームオーバー後に再度プレイするにはページをリロードしてください。

←

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>
		#player {
			width: 50px;
			height: 50px;
			background-color: yellow;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
			text-align: center;
			line-height: 50px;
			font-size: 30px;
			border-radius: 50%;
		}
		.enemy {
			width: 50px;
			height: 50px;
			background-color: red;
			position: absolute;
			top: 0;
			left: 0;
			border-radius: 50%;
			animation: moveEnemy 2s linear infinite;
		}
		@keyframes moveEnemy {
			0% {
				top: -10%;
				left: -10%;
			}
			50% {
				top: 110%;
				left: 110%;
			}
			100% {
				top: -10%;
				left: -10%;
			}
		}
	</style>
</head>
<body>
	<div id="player">😃</div>
	<script>
		let player = document.getElementById("player");
		let speed = 10;
		let enemyInterval = null;
		let isDead = false;

function movePlayer(event) {
			if (isDead) return;
			switch (event.key) {
				case "ArrowUp":
					player.style.top = parseInt(player.style.top) - speed + "px";
					break;
				case "ArrowDown":
					player.style.top = parseInt(player.style.top) + speed + "px";
					break;
				case "ArrowLeft":
					player.style.left = parseInt(player.style.left) - speed + "px";
					break;
				case "ArrowRight":
					player.style.left = parseInt(player.style.left) + speed + "px";
					break;
			}
			checkCollision();
		}

function createEnemy() {
			if (isDead) return;
			let enemy = document.createElement("div");
			enemy.classList.add("enemy");
			let x = Math.floor(Math.random() * window.innerWidth);
			let y = Math.floor(Math.random() * window.innerHeight);
			enemy.style.top = y + "px";
			enemy.style.left = x + "px";
			document.body.appendChild(enemy);
		}

function isOverlap(a, b) {
			let aRect = a.getBoundingClientRect();
			let bRect = b.getBoundingClientRect();
			return !(
				(aRect.bottom < bRect.top) ||
				(aRect.top > bRect.bottom) ||
				(aRect.right < bRect.left) ||
				(aRect.left > bRect.right)
			);
		}

document.addEventListener("keydown", movePlayer);
		enemyInterval = setInterval(createEnemy, 1000);

</script>
</body>
</html>

【ゲームの概要】
プレイヤーの顔文字を操作し、画面にランダムに現れる敵キャラクターを避け続けるゲームです。敵キャラクターに衝突するとゲームオーバーになります。ゲームオーバー後に再度プレイするにはページをリロードしてください。