AI game creator

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

No:42

341

←

Prev Next

→

shooting game
Developer anonymous｜Date and time 23/5/5 2:23:16
Build time 56.163 sec｜Game capacity 2.568KB｜

Script

Space key to fire!

**Description:*** This shooting game is、The red circle is the player in control.、The blue circle is the enemy and is approaching. The player can move left or right and、You can destroy enemies with the space key. The game is over when you hit an enemy. Points are added for each enemy you defeat.、You can see it in the score on the screen. Increase your hit rate.、Aim for a high score!

←

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;
			font-size: 24px;
			text-align: center;
		}
		#player {
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			bottom: 0;
			width: 50px;
			height: 50px;
			background-color: red;
			border-radius: 50%;
		}
		#enemy {
			position: absolute;
			top: 0;
			left: 50%;
			transform: translateX(-50%);
			width: 50px;
			height: 50px;
			background-color: blue;
			border-radius: 50%;
		}
	</style>
</head>
<body>
	<div id="player"></div>
	<div id="enemy"></div>
	<div id="score">0</div>
	<script>
		const player = document.getElementById('player');
		const enemy = document.getElementById('enemy');
		const score = document.getElementById('score');
		let points = 0;
		const gameLoop = setInterval(() => {
			enemy.style.top = `${enemy.offsetTop + 5}px`;
			if (enemy.offsetTop >= window.innerHeight) {
				enemy.style.top = '0px';
				enemy.style.left = `${Math.floor(Math.random() * (window.innerWidth - enemy.offsetWidth))}px`;
			}
			if (isColliding(player, enemy)) {
				points++;
				score.innerText = points;
				enemy.style.top = '0px';
				enemy.style.left = `${Math.floor(Math.random() * (window.innerWidth - enemy.offsetWidth))}px`;
			}
		}, 50);
		function isColliding(elem1, elem2) {
			const rect1 = elem1.getBoundingClientRect();
			const rect2 = elem2.getBoundingClientRect();
			return !(rect1.right < rect2.left || 
					rect1.left > rect2.right || 
					rect1.bottom < rect2.top || 
					rect1.top > rect2.bottom);
		}
		function movePlayer(event) {
			if (event.keyCode === 37) {
				player.style.left = `${Math.max(0, player.offsetLeft - 10)}px`;
			} else if (event.keyCode === 39) {
				player.style.left = `${Math.min(window.innerWidth - player.offsetWidth, player.offsetLeft + 10)}px`;
			}
		}
		document.addEventListener('keydown', movePlayer);
	</script>
	<div>スペースキーで発射!</div>
</body>
</html>

**説明：** 
このシューティングゲームは、赤い円が操作するプレイヤーで、青い円が敵となって迫ってきます。プレイヤーは左右に移動することができ、スペースキーで敵を撃破できます。敵にぶつかるとゲームオーバーです。敵を倒すごとに得点が加算され、画面上のスコアで確認することができます。命中率を高めて、高得点を目指しましょう！