Categories
JavaScript Answers

How to start HTML5 video at a particular position when loading with JavaScript?

Spread the love

Sometimes, we want to start HTML5 video at a particular position when loading with JavaScript.

In this article, we’ll look at how to start HTML5 video at a particular position when loading with JavaScript.

How to start HTML5 video at a particular position when loading with JavaScript?

To start HTML5 video at a particular position when loading with JavaScript, we can set the currentTime property to the number of seconds we want to jump to.

For instance, we write

document.getElementById("vid1").addEventListener(
  "loadedmetadata",
  (e) => {
    e.target.currentTime = 50;
  },
  false
);

to select the video element with getElementById.

Then we call addEventListener to listen to the loadedmetadata event, which is triggered when the video metadata is loaded.

In the event listener callback, we set the currentTime property of the video element to jump to 50 seconds.

Conclusion

To start HTML5 video at a particular position when loading with JavaScript, we can set the currentTime property to the number of seconds we want to jump to.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *