(one on one) barrage of games's game

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

No:53

321

←

Prev Next

→

(one on one) barrage of games
Developer anonymous｜Date and time 23/5/7 1:08:33
Build time 43.62 sec｜Game capacity 1.839KB｜

Script

(one on one) barrage of games

Tap the screen to start!

←

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">
	<style>
		body {
			background-color: #212121;
			color: #ffffff;
			font-family: sans-serif;
			font-size: 2rem;
			text-align: center;
			padding-top: 10%;
		}
		#player {
			position: absolute;
			bottom: 5%;
			left: 50%;
			transform: translateX(-50%);
			width: 5vw;
			height: 10vh;
			background-color: #ffa726;
			border-radius: 1vw;
		}
		#enemy {
			position: absolute;
			top: 5%;
			left: 50%;
			transform: translateX(-50%);
			width: 5vw;
			height: 5vh;
			background-color: #29b6f6;
			border-radius: 50%;
		}
	</style>
</head>
<body>
	<p>弾幕ゲーム</p>
	<p>画面をタップしてスタート！</p>
	<div id="player"></div>
	<div id="enemy"></div>
	<script>
		let x = 50; // プレイヤーの初期位置
		window.addEventListener("touchstart", function() {
			let id = setInterval(frame, 10); // 10ミリ秒ごとにframe関数を実行
			function frame() {
				if (x < 2.5 || x > 97.5) { // 画面外に出たらゲーム終了
					clearInterval(id);
					alert("Game Over!");
				} else {
					let enemy = document.getElementById("enemy");
					let enemyY = parseInt(window.getComputedStyle(enemy).getPropertyValue("top")); // 敵のy座標
					let enemyX = parseInt(window.getComputedStyle(enemy).getPropertyValue("left")); // 敵のx座標
					if (enemyY >= 90 && Math.abs(enemyX - x) < 5) { // 敵とプレイヤーが接触したらゲーム終了
						clearInterval(id);
						alert("Game Over!");
					} else {
						x += 0.5;
						document.getElementById("player").style.left = x + "%"; // プレイヤーの移動
						enemyY += 0.5;
						enemy.style.top = enemyY + "%"; // 敵の移動
					}
				}
			}
		});
	</script>
</body>
</html>