videoObject.volumeは、埋め込み動画(video要素)の音量を取得、もしくは、設定するプロパティ。
構文
取得
var $volume = $videoElementReference.volume;
戻り値
音量。ドキュメントに埋め込んだ動画ファイルの再生音量を示す数値。
設定
$videoElementReference.volume = 数値;
- 数値
- 再生音量を「0.0」(最小音量)から「1.0」(最大音量)の数値で指定。
サンプル
音量調整:
音量:
サンプルの動作について
2014/02/01現在、Chromeでのみ動作確認。
- 「音量調整:」の右側のレンジ入力欄で音量を調整できる。
- 「音量:」の右側に現在の音量を示す数値を表示する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
window.onload = function(){
setVolume( 0.5 );
document.getElementById( "sampleVolume" ).value = 0.5;
}
function setVolume( $volume ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.volume = $volume;
var $volume = $elementReference.volume;
document.getElementById( "sampleOutputVolume" ).innerHTML = $volume;
}
</script>
window.onload = function(){
setVolume( 0.5 );
document.getElementById( "sampleVolume" ).value = 0.5;
}
function setVolume( $volume ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.volume = $volume;
var $volume = $elementReference.volume;
document.getElementById( "sampleOutputVolume" ).innerHTML = $volume;
}
</script>
HTML
<p>
音量調整:
<input type="range" value="0.5" id="sampleVolume" min="0" max="1" step="0.1" onchange="setVolume(this.value)">
</p>
<p>音量:<span id="sampleOutputVolume"></span></p>
<video src="http://alphasis.info/wp-content/uploads/2014/01/javascript-dom-video-sample.mp4" id="sample" controls>
<p>お使いのブラウザはvideo要素に対応していません。</p>
</video>
音量調整:
<input type="range" value="0.5" id="sampleVolume" min="0" max="1" step="0.1" onchange="setVolume(this.value)">
</p>
<p>音量:<span id="sampleOutputVolume"></span></p>
<video src="http://alphasis.info/wp-content/uploads/2014/01/javascript-dom-video-sample.mp4" id="sample" controls>
<p>お使いのブラウザはvideo要素に対応していません。</p>
</video>