2

我一直在朋友网站上工作,试图修复他的 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。

4

1 回答 1

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 中添加 &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 的设置位置,所以也许这就是问题所在。

公里

于 2012-10-16T04:46:56.513 回答