Javascript DOM onseeking Event use currentTime property of the Video Object

Introduction

Using the currentTime property of the Video Object to display the current playtime position when the user starts to skip to a new position:

In this example, we attach a "seeking" event to the video element.

The currentTime property returns the current position (in seconds) of the video playback.

View in separate window

<!DOCTYPE html>
<html>
<body>
<p>Move to a new position in the video.</p>
<video id="myVideo" controls>
  <source src="video.mp4" type="video/mp4">
  <source src="video.ogg" type="video/ogg">
  Your browser does not support HTML5 video.
</video>//  w  w w .  j  a  va  2  s  .com

<p>Seeked to position: <span id="demo"></span></p>


<script>
// Get the video element with id="myVideo"
var x = document.getElementById("myVideo");

x.addEventListener("seeking", myFunction);

function myFunction() {
  // Display the current position of the video in a p element with id="demo"
  document.getElementById("demo").innerHTML = x.currentTime;
}
</script>

</body>
</html>



PreviousNext

Related