HTML リファレンスマニュアル

HTML タグ完全ガイド

HTML オーディオ/ビデオ DOM volumechange イベント

ボリュームを変更するとvolumechangeイベントがトリガーされます。

オンラインサンプル

ビデオの音量が変更されたときにポップアップメッセージを表示します:

例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">
<title>HTML　オーディオ/video　onvolumechange　イベントの使用-基本チュートリアル(oldtoolbag.com)</title>
</head>
<body>
<p>ビデオの音量を変更してみてください。</p>
<video　id="myVideo"　width="320"　height="176"　controls>
　　<source　src="movie.mp4"　type="video/mp4">
　　<source　src="movie.ogg"　type="video/ogg">
　　あなたのブラウザは HTML をサポートしていません5　video タグ。
</video>
<script>
var　vid　=　document.getElementById("myVideo");
vid.onvolumechange　=　function()　
{
　　　　alert("音量が変更されました");
};
</script>　　
</body>
</html>

テストをしてみる ‹/›

定義と使用方法

ビデオが変更されたときに/オーディオの音量が変更されたとき、volumechangeイベントが発生します。

このイベントが参照される場合：

ボリュームを上げるまたは下げる
ミュートまたはノンミュート

ヒント： Audioを使用して/Video オブジェクトの volume 属性を使用して設定または返します/ビデオ（audio/の音量。（video）

ブラウザの互換性

IEFirefoxOperaChromeSafari

文法

HTML で：

<audio|video onvolumechange="myScript">試してみてください

JavaScript で：

audio|video.onvolumechange=function(){myScript};試してみてください

JavaScript で、addEventListener() メソッドを使用して：

audio|video.addEventListener("volumechange", myScript);試してみてください

注意： Internet Explorer 8 およびもっと古い IE バージョンではサポートされていません addEventListener() メソッド。

技術的詳細

サポートする HTML タグ:	<audio> と <video>
サポートする JavaScript オブジェクト:	オーディオ、ビデオ

オンラインサンプル

オーディオの音量が変更されたときにポップアップメッセージを表示します：

例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">
<title>HTML　オーディオ/video　onvolumechange　イベントの使用-基本チュートリアル(oldtoolbag.com)</title>
</head>
<body>
<p>オーディオの音量を変更してみましょう。</p>
<audio　id="myAudio"　controls>
　　<source　src="horse.ogg"　type="audio/ogg">
　　<source　src="horse.mp3"　type="audio/mpeg">
　　あなたのブラウザは HTML をサポートしていません5　video タグ。
</audio>
<script>
var　aud　=　document.getElementById("myAudio");
aud.onvolumechange　=　function()　
{
　　　　alert("音量が変更されました");
};
</script>
</body>
</html>

テストをしてみる ‹/›

HTML オーディオ/ビデオ DOM リファレンスマニュアル

HTML: <template> タグ