revision:
The ontimeupdate attribute defines a script to run when the playing position of an audio/video has changed.
The ontimeupdate attribute is part of the event attributes, and can be used on the following elements: <audio> and <video>.
This event is invoked by playing the audio/video and moving the playback position (like when the user fast forwards to a different point in the audio/video)
<element ontimeupdate="script"></element>
script: the script to be run on ontimeupdate.
Move to a new position in the audio:
<p class="spec" id="demo">Move to a new position in the
audio:</p>
<audio style="margin-left:3vw;" id="myAudio" controls
ontimeupdate="audioFunction()">
<source src="../../pics/horse.wav" type="audio/wav">
Your browser does not support the audio element.
</audio>
<script>
function audioFunction() {
document.getElementById("demo").innerHTML = "You moved
to position " + document.
getElementById("myAudio").currentTime;
}
</script>
Move to a new position in the video:
<p class="spec" id="demo-1">Move to a new position in the
video:</p>
<video style="margin-left:3vw;" id="myVideo" width="320"
height="176" controls ontimeupdate=
"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 moved
to position " +
document.getElementById("myVideo").currentTime;
}
</script>