AI game creator

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

No:158

277

←

Prev Next

→

sniper game
Developer User2908｜Date and time 23/5/30 0:42:10
Build time 83.322 sec｜Game capacity 2.754KB｜

Script

SCORE: 0

This game is、The game is simple: shoot at randomly moving targets. The score is displayed in the upper left corner and、Click to shoot. When you shoot through the target、It moves randomly again. If you click on the target、The game is over. The score is displayed and、You will need to reload to play again. You can also play on your phone.

←

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: #f5f5f5;	
			font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
		}
		
		#container {
			margin: 0 auto;
			width: 90%;
			max-width: 600px;
			text-align: center;
		}
		
		#target {
			width: 200px;
			height: 200px;
			background-color: #BBB;
			position: relative;
			margin: 20px auto;
			border-radius: 50%;
			cursor: crosshair;
			box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
		}
		
		#shootButton {
			font-size: 24px;
			background-color: #500;
			color: #FFF;
			padding: 10px 20px;
			border: none;
			border-radius: 10px;
			cursor: pointer;
			margin-top: 20px;
			text-shadow: 1px 1px #333;
			box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
		}
		
		#score {
			font-size: 36px;
			font-weight: bold;
			margin-top: 30px;
			text-align: center;
			color: #555;
		}
		
		#gameOver {
			font-size: 48px;
			font-weight: bold;
			margin-top: 50px;
			text-align: center;
			color: #F00;
			display: none;
		}
	</style>
	<script>
		let score = 0;
		let target = document.getElementById("target");
		let shootButton = document.getElementById("shootButton");
		let scoreElem = document.getElementById("score");
		let gameOverElem = document.getElementById("gameOver");
		
		function resetTarget() {
			let x = Math.floor(Math.random() * (window.innerWidth - target.offsetWidth));
			let y = Math.floor(Math.random() * (window.innerHeight - target.offsetHeight));
			target.style.left = x + "px";
			target.style.top = y + "px";
		}
		
		function shoot() {
			score++;
			scoreElem.innerHTML = "SCORE: " + score;
			resetTarget();
		}
		
		function gameOver() {
			target.style.display = "none";
			shootButton.style.display = "none";
			gameOverElem.style.display = "block";
			gameOverElem.innerHTML = "GAME OVER<br/>SCORE: " + score;
		}
		
		function startGame() {
			resetTarget();
			target.onclick = gameOver;
			shootButton.onclick = shoot;
			scoreElem.innerHTML = "SCORE: " + score;
		}
		
		window.onload = startGame;
	</script>
</head>
<body>
	<div id="container">
		<div id="target"></div>
		<button id="shootButton">撃つ</button>
		<div id="score">SCORE: 0</div>
		<div id="gameOver"></div>
	</div>
</body>
</html>

このゲームは、ランダムに移動する的を撃ち抜くというシンプルな内容です。左上にスコアが表示され、クリックすることで撃つことができます。的を撃ち抜くと、再びランダムに移動します。的をクリックしてしまうと、ゲームオーバーとなります。スコアが表示され、もう一度遊ぶためには再読み込みする必要があります。スマホでもプレイ可能です。