Restart Vimeo iFrame with Froogaloop JavaScript and jQuery
My page dynamically launches one of several Vimeo iFrame embedded videos and I'm using jQuery to fade them in/out and start/stop. Right now, my close function hides the video and subsequently pauses it. If you bring up the same video after its been hidden it begins from where it was paused the time 开发者_StackOverflow社区before. I'd like it to restart. I can't figure out just the right action. Some how "stop" and "restart" aren't options (how illogical is that? play/pause/stop).
I'm linking to Vimeo's hosted version of Froogaloop JS and using jQuery to call the functions.
Thanks!
JavaScript:
$('#close, #underlay').click(function() {
$('.vim, #close, #container, #underlay').fadeOut(400);
var player=$f($('.vid:visible')[0]);
player.api('pause');
});
When you have it fade in, you could seek the video to the beginning like this:
player.api("seekTo", 0);
player.play();
To restart completely, I like
player.api('unload')
I prefer a solution of persistently reseting all the videos and then pausing them. Next, play the current video that is being shown.
Below code can be optimized, but it gets the job done with no real drawbacks.
function playCurrentVidPWA() {
let allVids = document.getElementsByClassName('vimeo-player');
let currentVideo = mySwiper.slides[mySwiper.activeIndex].querySelector('iframe');
// Pause all videos
if (allVids)
{
for (let i = 0; i < allVids.length; i++)
{
const iVid = allVids[i]
let player = new Vimeo.Player(iVid);
// Set the time of the video back to the begining
player.setCurrentTime(0)
// Pause the video for no frame-skip animations
player.pause()
}
}
// Play current slide video
if(currentVideo)
{
let player = new Vimeo.Player(currentVideo);
player.play()
}
}
精彩评论