Question

I am looking fore some code allowing me to launch automatically a video after another one.
I’am using the great video.js library, which has a quite complete API. I found some snippet to get an event listener working at the end of the 1st video, but then I cannot launch the second one.

This is working, displaying an alert at the end of the 1st video :

_V_("intro").ready(function(){
this.addEvent("ended", function(){
    alert('foo');
});
});

And this is also working, launching a video in fullscreen on page reload :

_V_("leader").ready(function(){
var leader = this;
leader.requestFullScreen();
leader.play();
});

But I can’t get the 2nd video launching in fullscreen at the end of 1st video…

Last subtility, I would like to entirely build the 2nd video with javascript, not having to write it and just hiding id with CSS.

Thank you folks !
Elliot

Answer 1

You can simply use the provided ‘src’ method in the Video.js API, if you want to play a second video right after the first one finishes it would work like this:

_V_("intro").ready(function(){
    this.addEvent("ended", function(){
        this.src({ type: "video/mp4", src: "http://path/to/second/video.mp4" });
    });
});