HTML - attributes - onseeked

revision:


Content

"onseeked" attribute : when user is finished to move to new position syntax some examples


"onseeked" attribute : when user is finished to move to new position

top

The onseeked attribute defines a script to run when the user is finished moving/skipping to a new position in the audio/video.
The onseeked attribute is part of the event attributes and can be used on the following elements: <audio> and <video>. Use the currentTime property of the Audio/Video Object to get the current playback position.


syntax

top

<element onseeked="script"></element>

script: the script to be run on onseeked.


some examples

top

Move to a new position in the audio

codes:
                    <p class="spec" id="audio-1">Move to a new position in the audio</p>
                    <audio style="margin-left:3vw;" id="myAudio" controls onseeked="seekContent()">
                        <source src="../../pics/horse.wav" type="audio/wav">
                        Your browser does not support the audio element.
                    </audio>
                    <script>
                        function seekContent() {
                            document.getElementById("audio-1").innerHTML = "You moved to position "
                            + document.getElementById("myAudio").currentTime;
                        }
                    </script> 
                

Move to a new position in the video:

codes:
                    <p class="spec" id="video-1">Move to a new position in the video:</p>
                    <video style="margin-left:3vw;" id="myVideo" width="320" height="176" controls
                    onseeked="seekVideo()">
                        <source src="../../pics/Wuzhen-20-10_02.mp4" type="video/mp4">
                        Your browser does not support HTML5 video.
                    </video>
                    <script>
                        function seekVideo() {
                        document.getElementById("video-1").innerHTML = "You moved to position " +
                        document.getElementById("myVideo").currentTime;
                        }
                    </script>