3

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

这里有各种相关问题，我找不到简单的“如何暂停”的答案。我是一个 jquery 新手，不能对 froogaloop 文档做出正面或反面。

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

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

当单击没有“click”类的元素时，它会隐藏它。但是视频在后台播放。Froogaloop 加载在小提琴中。感谢大家

4

2 回答 2

2

这是一个更新的FIDDLE，它可以让我想象中的暂停/播放工作。点击图片播放视频；单击外部或空白区域（您可以使用类来控制它）以暂停它；再次单击图像以从暂停位置播放。简单，没有按钮，没有多余的 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。

于 2015-05-17T02:57:35.943 回答
1

froogaloop 可能会让人头疼。

让您入门的代码在这里： https ://developer.vimeo.com/player/js-api#universal-with-froogaloop

我已经对其进行了调整以使其正常工作，我认为您在这里的期望是： https ://jsfiddle.net/fLe5xs4v/

像这样设置它：

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

请注意，如果您更改播放和暂停按钮中的文本，您将破坏此代码：

$('button').bind('click', function() {
    player.api($(this).text().toLowerCase());
});

试一试，它至少应该能让你朝着正确的方向前进。祝你好运！

于 2015-05-14T03:02:46.617 回答