Sample Coding for onvolumechange Attribute in HTML:
Tryit<!DOCTYPE html><html><head><title>Wikitechy onvolumechange attribute</title></head><body><video width="300" height="300" controls onvolumechange="OnVolumeChange()"><source src="hibiscus.mp4" type="video/mp4"></video><p id="para">Change the video volume :</p><script>
function OnVolumeChange()
{
document.getElementById("para").innerHTML = "Volume has been changed";
}
</script></body></html>
Code Explanation for onvolumechange Attribute in HTML:
<video> tag is used to defines that video controls should be visible.
id attribute returns the id of an element (the value of an element's id attribute is wikitechy).
onvolumechange attribute defines to run each time the volume of a audio has changed.
<source> tag defines several video resources.
src is an attribute, which describes the URL of the video file.
function Wikitechy () is a JavaScript function (block of code), which is created to perform the particular task.
document.getElementById gives the element which has the ID attribute with the defined value(Here Id value is wikitechy).innerHTML returns the content of an element.
Output for onvolumechange Attribute in HTML:
The video file has been displayed here.
The output shows the volume of the video has been changed.
After changing the volume, the message Volume has been changed is displayed.
Browser Support for onvolumechange Attribute in HTML:
Yes
Yes
Yes
Yes
Yes
Tips and Notes
The volume property is used for the Audio/Video Object to set the audio volume of an audio/video.
