HTML | DOM onvolumechange Event
The onvolumechange event in HTML DOM occurs when the media volume is changed. Use volume property to set/return the volume of the media.
This event is invoked by:
- Volume increasing/decreasing
- Muting/unmuting the media player
Syntax:
- In HTML:
<element onvolumechange="myScript">
- In JavaScript:
object.onvolumechange = function(){myScript};
- In JavaScript, using the addEventListener() method:
object.addEventListener("volumechange", myScript);
Example: Using the addEventListener() method
<!DOCTYPE html> < html > < head > < title > HTML DOM onvolumechange Event </ title > </ head > < body > < center > < h1 style = "color:green" >GeeksforGeeks</ h1 > < h2 >HTML DOM onvolumechange Event</ h2 > < video controls id = "videoID" > < source src = "GFG.mp4" type = "video/mp4" > </ video > </ center > < script > document.getElementById( "videoID").addEventListener("volumechange", GFGfun); function GFGfun() { alert("Volume changed"); } </ script > </ body > </ html > |
chevron_right
filter_none
Output:
Before:
After:
Supported Browsers: The browsers supported by DOM onvolumechange Event are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Apple Safari
- Opera