
Swapping video divs
Hi,
I currently have a video carousel that contains 8 videos, and a main video div which also contains a video. I want my main video div to be replaced by the videos from the video carousel when the main video is done.
jwplayer("main_video").setup({
file: "big_buck.mp4",
image: "big_buck.png",
height: 350,
width: 1000,
autostart: true,
events: {
onComplete:function(){
jwplayer("main_video").load('container1');
jwplayer("main_video").play()
}
}
});
jwplayer("container1").setup({
file: "big_buck.mp4",
image: "big_buck.png",
height: 150,
width: 250
});
jwplayer("container2").setup({
file: "big_buck.mp4",
image: "big_buck.png",
height: 150,
width: 250
});
jwplayer("container3").setup({
file: "big_buck.mp4",
image: "big_buck.png",
height: 150,
width: 250
});
that is my current setup, just testing it out on one video for now. The carousel videos are container1, container2, container 3. Right now when the main video div video finishes, it just turns the jwplayer black and i cant reload the original main video and i get thrown a 404 error in the console.
Im trying to avoid a playlist because my carousel is setup through the slick plugin, so i cant temper with it too much. Is there another way to do it? Thank you!