如何在点击下一张幻灯片时停止Youtube视频？

Question

http://www.redfoxwebtech.us/redfoxus/thinkingmaps/community/ 我在第一张幻灯片上添加了视频，当我点击下一张幻灯片时，视频应该停止播放

Answer 1

我设法修复（使用Vimeo测试）并且正在工作。我认为你可以使用相同的技术制作其他视频网站。

将onSlideChangeStart - 将在动画开始时执行的回调函数添加到其他幻灯片（下一个或上一个）非常重要。接收swiper实例作为参数。

var mySwiper = new Swiper (".swiper-container", {
onSlideChangeStart: function(){
    function playVideoVimeo(frame) {
        frame.each( function() {
            var url = jQuery(this).attr('src').split('?')[0];
            this.contentWindow.postMessage(JSON.stringify({ method: 'pause' }), url);
        });
    }
    jQuery(".swiper-container .swiper-slide").each(function( index ) {
        var element = jQuery(this).find("iframe");     
        playVideoVimeo(element);                
    });
}});