Ants move randomly out of their burrows.'s game | AI game creator

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

No:315

1673

Ants move randomly out of their burrows.
Developer User2983｜Date and time 23/6/12 1:26:51
Build time 25.794 sec｜Game capacity 2.186KB｜

JavaScriptを使ったアプリの例として、"アリ追いかけゲーム"を考えてみましょう。このゲームでは、画面上に巣穴とアリが表示され、ユーザーはスマホのタッチ操作でアリを追いかけてタップすることで得点を取得することが目的です。以下が実際のプログラムの例です。

🕳

🐜

🐜

🐜

Score: 0

上記のコードでは、"巣穴"と3匹の"アリ"を画面上に表示し、スマホのタッチ操作でアリを追いかけてタップすることで得点を取得できます。アリはランダムに動く設定で、一定時間ごとにランダムな位置に移動します。また、得点を表示するために、score変数を用意し、アリがタップされるたびに値を加算していきます。このように、JavaScriptを使ってシンプルなゲームを作ることができます。絵文字を使うことで、より可愛らしい雰囲気を出すことも可能です。

→ 　

1　

0　

[PR]現在の欲しいものランキング

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

(C)2023 HisashiApp

JavaScriptを使ったアプリの例として、"アリ追いかけゲーム"を考えてみましょう。このゲームでは、画面上に巣穴とアリが表示され、ユーザーはスマホのタッチ操作でアリを追いかけてタップすることで得点を取得することが目的です。

以下が実際のプログラムの例です。

```
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>アリ追いかけゲーム</title>
	<style>
		#nest {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
			font-size: 5em;
		}
		.ant {
			position: absolute;
			font-size: 2em;
			cursor: pointer;
			transition: all 0.3s ease;
		}
	</style>
</head>
<body>
	<div id="nest">🕳</div>
	<div id="ant1" class="ant">🐜</div>
	<div id="ant2" class="ant">🐜</div>
	<div id="ant3" class="ant">🐜</div>
	<div id="score">Score: 0</div>
	<script>
		let score = 0;
		let timer = setInterval(moveAnts, 1000);

document.querySelectorAll('.ant').forEach(function(ant){
			ant.addEventListener('click', function(){
				score++;
				document.getElementById('score').innerText = "Score: " + score;
				this.style.display = 'none';
			});
		});

function moveAnts(){
			document.querySelectorAll('.ant').forEach(function(ant){
				let randomLeft = Math.floor(Math.random() * (window.innerWidth - 50));
				let randomTop = Math.floor(Math.random() * (window.innerHeight - 50));

ant.style.left = randomLeft + "px";
				ant.style.top = randomTop + "px";
			});
		}
	</script>
</body>
</html>
```

上記のコードでは、"巣穴"と3匹の"アリ"を画面上に表示し、スマホのタッチ操作でアリを追いかけてタップすることで得点を取得できます。 アリはランダムに動く設定で、一定時間ごとにランダムな位置に移動します。

また、得点を表示するために、score変数を用意し、アリがタップされるたびに値を加算していきます。

このように、JavaScriptを使ってシンプルなゲームを作ることができます。絵文字を使うことで、より可愛らしい雰囲気を出すことも可能です。