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

No:3888

4088

←

Prev Next

→

May I make a Gorman?
Developer User3694｜Date and time 23/6/26 22:04:10
Build time 28.843 sec｜Game capacity 2.321KB｜

Script

了解しました。では、以下のようなシンプルなゲームを作成します。ゲームの名称は「Emojiタッチ」です。プレイヤーは、指定された時間内に画面に表示される特定の絵文字をできるだけたくさんタッチするゲームです。以下が実際のプログラムです。

Emojiタッチ

画面に表示された絵文字をできるだけたくさんタッチしよう！

残り時間：30秒

スコア：0

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

了解しました。では、以下のようなシンプルなゲームを作成します。
ゲームの名称は「Emojiタッチ」です。
プレイヤーは、指定された時間内に画面に表示される特定の絵文字をできるだけたくさんタッチするゲームです。
以下が実際のプログラムです。

<!DOCTYPE html>
<html>
<head>
	<title>Emojiタッチ</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
	<h1>Emojiタッチ</h1>
	<p>画面に表示された絵文字をできるだけたくさんタッチしよう！</p>
	<p>残り時間：<span id="seconds">30</span>秒</p>
	<h2 id="score">スコア：0</h2>

// ゲームの時間（秒）
		var time = 30;

// ゲーム中のスコア
		var score = 0;

// 残り時間表示のタグ
		var secondsLeft = document.getElementById("seconds");

// スコア表示のタグ
		var scoreTag = document.getElementById("score");

// ゲーム開始
		var timer = setInterval(function() {
			// 残り時間を1秒減らす
			time--;
			secondsLeft.innerHTML = time;

if (time === 0) {
				// 時間が終了したらゲーム終了
				clearInterval(timer);
				alert("ゲーム終了！スコア：" + score);
			} else {
				// 残り時間がある場合は絵文字を表示
				showEmoji();
			}
		}, 1000);

// 絵文字を表示する関数
		function showEmoji() {
			var randomIndex = Math.floor(Math.random() * emojis.length);
			var emoji = emojis[randomIndex];

// 絵文字を表示する要素を作成
			var emojiElem = document.createElement("div");
			emojiElem.innerHTML = emoji;
			emojiElem.style = "font-size: 5rem; opacity: 0.8; position: absolute; top: " + Math.floor(Math.random() * 90) + "%; left: " + Math.floor(Math.random() * 90) + "%; transform: translate(-50%, -50%);";
			emojiElem.onclick = function() {
				score++;
				scoreTag.innerHTML = "スコア：" + score;
				this.remove();
			};

// 絵文字を画面に追加
			document.body.appendChild(emojiElem);
		}
	</script>
</body>
</html>