HTML Audio/Video DOM volumechangeEvents

HTML Audio/Video DOM Reference Manual

Example

Pop up a prompt message when the volume of the video changes:

var vid = document.getElementById("myVideo");
vid.onvolumechange = function() {
alert("Volume changed");
};

Try it Yourself »

This article contains more examples at the bottom.


Definition and Usage

The volumechange event is triggered when the volume of the audio/video changes.

Cases in which this event is referenced:

  • Increase or decrease volume
  • Mute or unmute

Tip:Use of Audio/Video objectsvolumeThe property is used to set or return the volume of the audio/video.


Browser Support

The numbers in the table indicate the version number of the first browser that supports this event.

Events
volumechange Yes 9.0 Yes Yes Yes


Syntax

In HTML:

<audio|video onvolumechange="myScript">Try it Yourself

In JavaScript:

audio|video.onvolumechange=function(){myScript};Try it Yourself

In JavaScript, using the addEventListener() method:

audio|video.addEventListener("volumechange", myScript);Try it Yourself

Note:Internet Explorer 8 and earlier IE versions do not supportaddEventListener()method.


Technical Details
Supported HTML tags: <audio> and <video>
Supported JavaScript objects: Audio, Video


Examples

More Examples

Example

Pop up a prompt message when the volume of the audio changes:

var aud = document.getElementById("myAudio");
aud.onvolumechange = function() {
alert("Volume changed!");
};

Try it Yourself »


HTML Audio/Video DOM Reference Manualother extensions