I am using the HTML 5 "Video" tag to show the video on my page with the "Loop" feature or attribute.

Is there any way we can add a delay or gap between video using the "Loop" attribute??

<video id="myVideo" autoplay loop src=".mp4">

Please refer the link to see the Video tag code > "/"

Please suggest!

Updated my code, my video tag DO NOT have controls.

Thanks!

I am using the HTML 5 "Video" tag to show the video on my page with the "Loop" feature or attribute.

Is there any way we can add a delay or gap between video using the "Loop" attribute??

<video id="myVideo" autoplay loop src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4">

Please refer the link to see the Video tag code > "http://jsfiddle.net/nrf5fbh8/1/"

Please suggest!

Updated my code, my video tag DO NOT have controls.

Thanks!

• javascript
• jquery
• html
• video
• timedelay

• 1 One way to do it would be to use a listener combined with a JS timeout to tell it to replay the video after x amount of seconds once the video finishes playing(instead of using the loop attribute). – APAD1 Commented Aug 17, 2015 at 20:23
• Can you please explain using the link I provided by showing what you mean?? would be a great help!!! Thanks – UID Commented Aug 17, 2015 at 20:25
• Hey APAD1: Just to update, my video tag donot have controls showing.. just updated my question too! – UID Commented Aug 17, 2015 at 20:29
• 1 No problem, removing controls will not affect my solution. – APAD1 Commented Aug 17, 2015 at 20:33

1 Answer 1

Expanding on my comment above, basically instead of using the loop attribute you can set up a listener and place a function within the listener to replay the video after a specified amount of time(in milliseconds) once the video has ended. The JS would look like this:

document.getElementById('myVideo').addEventListener('ended',myHandler,false);
function myHandler(e) {
    console.log('ended');
    setTimeout(function(){
        document.getElementById('myVideo').play();
    }, 5000);
}

Updated Fiddle