VideoJS - Seamless Video

New here and you have a question for those who have experience with HTML5 video and / or VideoJS player (I am also open to use another player, if necessary).

I have one video that includes the insert part and the part that I would like to loop. I did this to avoid a “black flash” when loading the second part.

So my question is that I would like this second part to be completely enclosed, and it seems that it cannot completely cancel it. It seems like there is a second or a delay before it starts playing again. I had a video editor that set the loop point to exactly 36 seconds, and I use the following code to search for up to 36 seconds and play after reaching the goal.

myPlayer.addEvent("ended", function () { myPlayer.currentTime(36); myPlayer.play(); }); 

This will cause the camcorder to return to the first frame, then skip to 36 seconds and then play back. I will try to set the listener to the second second of the video and do a search, but I'm still worried about the instant delay after the search.

Any help would be greatly appreciated!

Alex

UPDATE: I managed to eliminate the bit where it goes back to the first frame by editing the original video.js file to remove the default functions when the "finished" event is fired (basically it looks like this: pause (); currentTime (0); pause (); ")

Now the video will go directly to the 36 second mark where I need it, but the problem is that it still registers the video as completed and stops it before playing it again at 36 seconds, creating a slight loop delay. I’m trying to understand how I can make him listen, maybe the second thing is that the video is about to end and will call the seek (currentTime) function, and then, unlike the “finished” event listener.

+4
source share
1 answer

Try breaking the video into two sections: input and part of the loop. Create a <video> element for each of them and place them in the same place, with the second video hidden. Set the "ended" event to input to change the screen and start the second video. Then you can set the loop attribute to the second element of the video.

You should not have a problem playing two videos together if you have the preload attribute, at least for looping video.

If this does not work, try making two video elements with the same clip-on video. During the game, you can hide the other and return its currentTime to zero, so any delay in the search will occur when no one is watching. (I hope the browser is smart enough to cache the video file and download it only from the network once, but you can experiment.)

(Unfortunately, none of them will work on the ipad, as the mobile safari does not support multiple media elements on the same web page.)

+1
source

All Articles