html5 の audio / video の音量を設定したり再生時間を求めたりする

mp3 プレイヤを作る上で欠かせないものの一つになる、音量の設定や再生時間の取得。これも html5 の video / audio 要素の機能に javascript 側で操作できる。

例えば、html 側で次のような audio ソースが定義されているとする。

<audio id="mp3" src="xxx.mp3" autobuffer></audio>

id:mp3 の音源を変数 audio として定義しておく。

// id:mp3 を変数 audio として定義
var audio = document.getElementById("mp3");

さて、この xxx.mp3 の音量を設定したいときは、こんな感じで。

// volume を 0.5（0〜1 の数値）に設定
audio.volume = 0.5;

次に、現時点での再生時間を取得したい場合は、次のように記述する。ここでは変数 playTime に代入することとするとこんな感じ。

// 現在の再生時間を変数 playTime に代入
playTime = audio.currentTime;

最後に、この音源全体の時間を取得したいときはこんな感じ。変数 audioLength に代入してみる。

// 音源全体の時間を変数 audioLength に代入
audioLength = audio.duration;

jai - javascript audio interface