revision:
The onvolumechange attribute defines a script to run each time the volume of a video/audio has been changed.This event is invoked by increasing or decreasing the volume or by muting or unmuting the media player.
The onvolumechange attribute is part of the event attributes and can be used on the following elements: <audio> and<video>.
<element onvolumechange="script"></elemen>
script: this attribute contains single value script which works when the onvolumechange event is called.
Change the volume of the audio:
codes:
<p class="spec" id="demo">Change the volume of the
audio:</p>
<audio style="margin-left:3vw;" id="myAudio" controls
onvolumechange="changeFunction()">
<source src="../pics/horse.wav" type="audio/wav">
Your browser does not support the audio element.
</audio>
<script>
function changeFunction() {
document.getElementById("demo").innerHTML = "You changed the volume";
}
</script>
Change the volume of the video:
codes:
<p class="spec" id="demo-1">Change the volume of the
video:</p>
<video style="margin-left:3vw;" id="myVideo" width="320"
height="176" controls
onvolumechange="videoFunction()">
<source src="../pics/Wuzhen-20-10_02.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
<script>
function videoFunction() {
document.getElementById("demo-1").innerHTML = "You changed
the volume of the video";
}
</script>