HTML5のAudio要素とBase64を使った効果音の連続発生
audio要素は、文書内に音声コンテンツを埋め込むために使用します。
src属性または source要素を使用してメディアを選択します。
CASE. src属性で単一の音声ファイルを指定する
CASE. source要素で複数の音声ファイルを指定する
・preload属性
・autoplay属性
autoplay属性が存在する場合、自動再生
・loop属性
loop属性が存在する場合、ループ再生
・controls属性
controls属性が存在する場合、再生や停止のためのインターフェイスを表示
CASE. Audioオブジェクトから音声ファイルを制御する
function fPlayAudio() {
oAudio.play();
}
function fPauseAudio() {
oAudio.pause();
}
function fStopAudio() {
oAudio.pause();
oAudio.currentTime = 0;
}
function fUpVolume() {
oAudio.volume = oAudio.volume + 0.25;
}
function fDownVolume() {
oAudio.volume = oAudio.volume – 0.25;
}
・Audio()
audio要素オブジェクトを生成する
・play()
再生する
・pause()
一時停止する
・load()
ロードを開始する（再生は行わない）
・currentTime
現在の再生位置を表す秒数
・volume
現在のボリューム、0.0（無音）から1.0（最大）まで指定可能
音声ファイルの読込によって音声データの連続再生を行うと音が遅れて再生されます。
これを回避する為Base64を使って音声データを読込みます。
base64とは、すべてのデータを64進数で表すエンコード方式です。
base64でエンコードした音楽をhtmlにそのまま埋め込む事で高速化を図ります。
CASE. Base64を使った効果音の連続再生
for (var i = 0; i <= pMax; i++) {
oAudio[i] = new Audio(pBase64);
oAudio[i].load;
}
}
function fPlayAudio() {
oAudio[pNow].play();
pNow += 1;
if (pNow > pMax){
pNow = 0;
}
}
サンプルでは0～5番までの配列を元に、6個のAudioオブジェクトを作成しています。
各オブジェクトにBase64でエンコードした音声データを読込させています。
昇順に再生させる事で6個までの効果音の音かぶりを可能にしています。
: DATA
: BLOG
: PRAVACY POLICY
タイトルへ
サウンド設定
スクリーン設定