【问题标题】:Using Froogaloop to pause Vimeo on click使用 Froogaloop 在点击时暂停 Vimeo
【发布时间】:2012-09-01 17:39:03
【问题描述】:

我的网站上有一个视频播放器,其中包含多个视频,全部采用滑块式布局。下面有每个视频的缩略图,如果单击任何缩略图,我需要任何正在播放的视频来暂停。我脑子里有 froogaloop.js,我的 scripts.js 文件中有这段代码: (函数(){

            // Listen for the ready event for any vimeo video players on the page
            var vimeoPlayers = document.querySelectorAll('iframe'),
                player;

            for (var i = 0, length = vimeoPlayers.length; i < length; i++) {
                player = vimeoPlayers[i];
                $f(player).addEvent('ready', ready);
            }

            /**
             * Utility function for adding an event. Handles the inconsistencies
             * between the W3C method for adding events (addEventListener) and
             * IE's (attachEvent).
             */
            function addEvent(element, eventName, callback) {
                if (element.addEventListener) {
                    element.addEventListener(eventName, callback, false);
                }
                else {
                    element.attachEvent(eventName, callback, false);
                }
            }

            /**
             * Called once a vimeo player is loaded and ready to receive
             * commands. You can add events and make api calls only after this
             * function has been called.
             */
            function ready(player_id) {
                // Keep a reference to Froogaloop for this player
                var container = document.getElementById(player_id).parentNode.parentNode,
                    froogaloop = $f(player_id),
                    apiConsole = container.querySelector('.console .output');

                /**
                 * Prepends log messages to the example console for you to see.
                 */
                function apiLog(message) {
                    apiConsole.innerHTML = message + '\n' + apiConsole.innerHTML;
                }

                // Setup clear console button
                var clearBtn = container.querySelector('.console button');
                addEvent(clearBtn, 'click', function(e) {
                    apiConsole.innerHTML = '';
                }, false);

                apiLog(player_id + ' ready!');
            }
        })();

然后我有这个作为我的缩略图:

jQuery("a.switch-foto").click(function(){
    jQuery(".fotos").fadeOut();
    jQuery(".fotos").removeClass("first");
    jQuery('#see_'+this.id).delay(600).fadeIn();
    froogaloop.api('pause');
});

但是当我在我的网站上测试它时 - 它不起作用 - 我收到此错误: 未捕获的 ReferenceError:未定义 froogaloop

谁能帮忙?抱歉,我不太了解 Froogaloop。

【问题讨论】:

    标签: vimeo froogaloop


    【解决方案1】:

    乍一看,在点击事件中,没有定义 froogaloop.api 调用。为了暂停视频,您应该将播放器传递给 Froogaloop 以暂停。像这样的:

    Froogaloop( jQuery('iframe')[0] ).api('pause');
    

    请注意,Froogaloop 有大写字母。 我也和 Froogaloop 有关系。希望对您有所帮助。

    【讨论】:

      猜你喜欢
      • 2015-07-25
      • 2012-01-16
      • 1970-01-01
      • 2011-08-25
      • 2013-01-05
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-12-12
      相关资源
      最近更新 更多