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

No:4326

592

←

Prev Next

→

A button that displays an infinite number of rando..ALL
Developer User3771｜Date and time 23/6/27 19:48:53
Build time 21.258 sec｜Game capacity 1.91KB｜

Script

を作成するゲームを作ります。以下が実装例です。

Animal Sounds Game

ランダムな動物の鳴き声を再生します。

このゲームでは、ボタンをクリックするとランダムな動物の鳴き声が表示され、音も再生されます。スマートフォンでも操作しやすいように、ボタンサイズを大きめにしています。また、絵文字を使って動物の種類を表現しています。このゲームはシンプルですが、ランダムに鳴く動物の種類を増やすなど、拡張する余地があると思います。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

を作成するゲームを作ります。

以下が実装例です。

```
<!DOCTYPE html>
<html>
<head>
	<title>Animal Sounds Game</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			font-family: Arial, sans-serif;
			text-align: center;
		}
		button {
			font-size: 2em;
			padding: 0.5em 1em;
			margin: 1em;
			border: none;
			border-radius: 1em;
			background-color: #4CAF50;
			color: #fff;
			cursor: pointer;
			outline: none;
		}
	</style>
</head>
<body>
	<h1>Animal Sounds Game</h1>
	<p>ランダムな動物の鳴き声を再生します。</p>
	<button onclick="playSound()">鳴き声を聞く</button>
	<script>
		// 鳴き声の配列
		var sounds = [
			"🐶 ワンワン",
			"🐱 ニャー",
			"🐴 ヒヒーン",
			"🐻 グゥウ",
			"🐵 ウキキ",
			"🐰 キュン",
			"🐷 ブーブー",
			"🐔 コケコッコー",
			"🦜 キャーキャー",
			"🐍 ズズッ"
		];

// ボタンを押したときのイベントハンドラ
		function playSound() {
			// ランダムな鳴き声を選ぶ
			var sound = sounds[Math.floor(Math.random() * sounds.length)];
			// 鳴き声を表示する
			var soundElem = document.createElement("p");
			soundElem.textContent = sound;
			document.body.appendChild(soundElem);
			// 音を鳴らす
			var audioElem = new Audio("sound.mp3");
			audioElem.play();
		}
	</script>
</body>
</html>
```