0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

1つのjsファイルで効果音を鳴らす

Last updated at Posted at 2021-05-28

音データをdata uriとしてjsファイル内に保持します。また、高速でタイプ音を漏れなくならせるように、8個のaudioオブジェクトを用意して、順番に呼び出しながら音を鳴らします。

ソースコード例です。

sound.js
const sound = {
	audio:[],
	index:0,
	init:()=>{
		for(let i=0;i<8;i++){
			sound.audio.push(new Audio(sound.data_uri));
		}
	},
	play:()=>{
		sound.audio[sound.index%sound.audio.length].play();
		sound.index += 1;
	},
	data_uri:"data:audio/mpeg;base64,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",
};

利用例です。

1ファイルでタイピングゲームを作るを作るをご参照ください。

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?