Question

我使用光滑的滑块作为多个图库滑块，其中一个项目是YouTube剪辑。一切都很好，除非用户点击视频继续播放的下一张或上一张幻灯片。我似乎无法找到有关如何在YouTube剪辑不合时自动暂停或停止YouTube剪辑的任何文档。

Answer 1

我正在使用光滑的v1.5.9并解决此问题，我目前正在使用jquery .each来遍历所有iframe，并要求每个iframe停止播放在滑动滑块的afterChange事件被触发后。

如何停止iframe：

您可以参考here了解如何停止/暂停youtube iframe。

Slick Slider的afterChange活动：

您可以访问slick-slider的github，了解有关其events/settings

的更多信息

以下是我的参考代码：

$('.hero-slider').on('init', function(event, slick){
    //init code goes here
}).on('afterChange',function(e,o){
    //on change slide = do action
    $('iframe').each(function(){
        $(this)[0].contentWindow.postMessage('{"event":"command","func":"' + 'stopVideo' + '","args":""}', '*');    
    });
}).slick();

p / s：记住你的youtube iframe的参数＆quot; enablejsapi = 1：

<iframe src="https://www.youtube.com/embed/xxxxxx?autoplay=0&enablejsapi=1"></iframe>

滑动滑块 - 当滑块进入下一帧时暂停YouTube剪辑

1 个答案: