güingingly cuingingly's game

Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 157

Warning: in_array() expects parameter 2 to be array, bool given in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 476

Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 484
güingingly cuingingly's game | AI game creator

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

No:4033

600

←

Prev Next

→

güingingly cuingingly
Developer User3694｜Date and time 23/6/27 2:40:36
Build time 30.767 sec｜Game capacity 2.531KB｜

Script

この要件に基づいて、以下のようなJavaScriptゲームのコードを提供することができます。

このゲームは、スマホ（またはマウス）を使ってプレイすることができます。ゲームエリアの中で、プレイヤーは緑の四角で表され、下に落ち続けます。ユーザーは画面をタップ（またはクリック）することで、プレイヤーを一時的に上に移動させることができます。障害物は赤い長方形で表され、上から下にアニメーションされ、プレイヤーが通過することができない位置にあります。プレイヤーが障害物にぶつかると、ゲームは終了し、得点が表示されます。得点は、プレイヤーが生き残った時間（＝障害物を回避した回数）を表します。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

この要件に基づいて、以下のようなJavaScriptゲームのコードを提供することができます。

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>スマホゲーム</title>
	<style>
		#gameArea {
			height: 300px;
			width: 100%;
			background-color: #F2F2F2;
			position: relative;
		}
		#player {
			height: 50px;
			width: 50px;
			background-color: green;
			position: absolute;
			bottom: 0px;
			left: 50%;
			margin-left: -25px;
			transition: left 0.5s ease-out, bottom 0.5s ease-out;
		}
		#obstacle {
			height: 20px;
			width: 80px;
			background-color: red;
			position: absolute;
			top: -20px;
			left: 0;
			animation: moveObstacle 2s linear infinite;
		}
		@keyframes moveObstacle {
			from { left: 0; }
			to { left: calc(100% - 80px); }
		}
	</style>
</head>
<body>
	<div id="gameArea">
		<div id="player"></div>
		<div id="obstacle"></div>
	</div>
	
	<script>
		document.addEventListener("DOMContentLoaded", function() {
			var player = document.getElementById("player");
			var gameArea = document.getElementById("gameArea");
			var obstacle = document.getElementById("obstacle");
			var score = 0;
			
			gameArea.addEventListener("mousedown", function() {
				player.style.bottom = "100px";
			});
			
			gameArea.addEventListener("mouseup", function() {
				player.style.bottom = "0px";
			});
			
			setInterval(function() {
				var playerBottom = parseInt(player.style.bottom);
				var obstacleLeft = parseInt(obstacle.style.left);
				var obstacleTop = parseInt(obstacle.style.top);
				
				if (playerBottom <= obstacleTop && obstacleLeft <= 50 && (obstacleLeft + 80) >= 50) {
					alert("ゲームオーバー！ 得点: " + score);
					location.reload();
				} else {
					score++;
				}
			}, 50);
		});
	</script>
</body>
</html>