我一直在朋友网站上工作,试图修复他的flexslider实现,这样如果正在播放vimeo视频并且用户切换到另一张幻灯片,它将暂停该视频。我在这种情况下使用froogaloop和jquery时遇到问题。以下是我一直在尝试的一些代码:
(function () { jQuery('.flexslider').flexslider({
slideshowSpeed: slideshowDelay+"000",
directionNav: false,
animation: "fade" ,
after: function (slider)
{
console.log("next");
var currentSlide = slider.currentSlide;
var slides = slider.slides;
jQuery(slides).each( function (i)
{
if(i != currentSlide)
{
var slide = jQuery(slides[i]);
jQuery(slide).attr({class : 'slide_selector'})
var vimeo = jQuery('.slide_selector iframe');
if(vimeo.length !== 0)
{
var src = jQuery(vimeo).attr('src')
var controlObject = {"method" : "pause" };
var domWindow = vimeo[0].contentWindow;
jQuery(vimeo[0]).bind('ready' , function
{
console.log("PlayerId: "+ player_id)
froogaLoop(player_id).api('pause');
});
}
}
})
}
});
showProject(projectSlug);
});)
所以这没有任何作用。我读到我应该在Froogaloop框架中使用init函数,但是运行Froogaloop.fn.init(只有达到它的方式)告诉我,我放入的任何东西都没有getAttributes属性。这一切都令人困惑。我认为我的主要问题是如何使用froogaloop初始化这些iframe?
请注意。我在我的库版本中用froogaLoop替换了$ f,因为$似乎干扰了wordpress。
答案 0 :(得分:1)
我在这看到一些问题。
(虽然没有显示,但我假设您正确包含了froogaloop js文件,否则您将看不到getAttributes错误。)
我将向您展示我刚为我的网站所做的代码片段,您可以将其合并到您自己的代码中。
以下是我网站上加载vimeo播放器的相关html:
<iframe id="vvq-62-vimeo-1" src="http://player.vimeo.com/video/50138878?title=1&byline=1&portrait=0&fullscreen=1&api=1"></iframe>
首先要注意的是,必须在src中添加&amp; api = 1才能激活api。
完成后,这个标准的jQuery将为您提供iframe:
iframe =jQuery('#vvq-62-vimeo-1')[0];
这将启动froogaloop播放器:
player = $f(iframe);
如果您在控制台中测试它,那么此时您应该看到:
e.fn.e.init
然后你可以运行任何api命令,例如这个命令来播放视频:
player.api('play');
仅供参考,当您尝试在无效对象上运行froogaloop api时,会出现getAttributes错误。看看上面的代码,不清楚player_id在哪里设置,所以也许这就是问题所在。
微米(mKm)