javascript - 使用 vimeo api Froogaloop 简单暂停

Question

尝试调用 vimeo api 以在单击事件时暂停视频以隐藏它。并且，在再次点击以显示视频时，从暂停位置播放视频。

这里有各种各样的相关问题，我找不到简单的“如何暂停”的答案。我是 jquery 新手，无法理解 froogaloop 文档。

这是一个 FIDDLE ，以及我当前用于隐藏视频的 jquery 脚本

$(document).click(function (event) {
    if (!$(event.target).hasClass('click')) {
        $('#video').hide();
    }      
});

当没有“click”类的元素被点击时隐藏它。但视频在后台播放。 Froogaloop 被加载到 fiddle 中。谢谢大家

Answer 1

这是更新的 FIDDLE这让暂停/播放工作如我所想。点击图片播放视频；单击外部或空白区域 ( you control this with classes ) 暂停它；再次单击图像从暂停位置播放。简单，没有按钮，没有多余的 jquery 或 froogaloop 代码。

把它放在这里是为了那些可能从中受益的人。并为帮助我入门的 mbrrw +1。

var iframe = $('#video iframe')[0];
var player = $f(iframe);

$('.showvideo').on('click', function(){
    $('#video').show();
    $('.image').hide();
    player.api('play');
});

$(document).click(function (event) {
          if (!$(event.target).hasClass('click')) { //if what was clicked does not have the class 'click' (ie. any empty space)
    $('#video').hide();
    $('.image').show();
    player.api('pause');
          }
});

请记住将 api=1 附加到 vimeo 链接。并且 url 必须是 https，而不是 http。