Skip to content Skip to sidebar Skip to footer

Controlling Multiple Vimeo Embeds Using Api Coming From Cms

I'm having a bit of trouble getting multiple Vimeo video embeds to play nicely on a site I'm building. You can see the site here: http://bruprodu.nextmp.net/ On this page (the home

Solution 1:

This can be done entirely with JavaScript/jQuery. I don't use froogaloop, but it's probably a good idea given it's what Vimeo recommends. Here are some functions without froogaloop which work.

function pauseAllVideos(){
    $('iframe').each(function(elm){
        if($(this).attr('src').match(/vimeo/ig))
            $(this)[0].contentWindow.postMessage(JSON.stringify({ method: 'pause' }), $(this).attr('src').split('?')[0]);
    });
}

//uses CSS selector id
function playVimeoVideo(id){
    $(id)[0].contentWindow.postMessage(JSON.stringify({ method: 'play' }), $(id).attr('src').split('?')[0]);
}

//example of calling both functions after some button is clicked
$("#somebutton").on('click', function(){
    pauseAllVideos();
    playVimeoVideo("#somevideo");
})

Post a Comment for "Controlling Multiple Vimeo Embeds Using Api Coming From Cms"