暫停幻燈片上貓頭鷹傳送帶的HTML5視頻

我使用貓頭鷹傳送帶2.0.0-beta.2.4和在一張幻燈片中我有一個HTML5視頻。我想要做的是當我更換幻燈片時，如果暫停不可能，我希望視頻暫停或停止。幻燈片可以通過拖動，觸摸，下一個和上一個按鈕以及鍵盤箭頭進行更改。暫停幻燈片上貓頭鷹傳送帶的HTML5視頻

我的腳本看起來像現在這種權利：

$('.owl-carousel').owlCarousel({ 
    items: 1, 
    animateOut: 'fadeOut', 
    animateIn: 'fadeIn', 
    URLhashListener: true, 
    startPosition: 'URLHash', 
    nav: true, 
    autoHeight : true, 
    video:true, 
}); 

var owl = $('.owl-carousel').data('owlCarousel'); 

$(document.documentElement).keyup(function(event) { 
    if (event.keyCode == 37) { 
     owl.prev(); 
    } else if (event.keyCode == 39) { 
     owl.next(); 
    } 
});

我聽說過onMove或回調函數，但我不太瞭解他們。

來源

2015-02-06 Henric Åkesson

什麼是你目前的代碼沒有做/做錯你想解決？ – dg99 2015-02-06 18:03:38

@ dg99，就像我在我的文本中寫的那樣，我想在暫停幻燈片時暫停視頻（如果播放的話）。 – 2015-02-06 22:43:02

我用這個代碼解決它：

 onTranslate: function() { 
     $('.owl-item').find('video').each(function() { 
      this.pause(); 
     }); 
    }

所以最終的代碼爲我的貓頭鷹傳送帶是：

$('.owl-carousel').owlCarousel({ 
    items: 1, 
    animateOut: 'fadeOut', 
    animateIn: 'fadeIn', 
    URLhashListener: true, 
    startPosition: 'URLHash', 
    nav: true, 
    autoHeight: true, 
    video: true, 
    responsiveRefreshRate: 100, 
    onTranslate: function() { 
     $('.owl-item').find('video').each(function() { 
      this.pause(); 
     }); 
    } 
});

來源

2015-02-12 13:39:54

這似乎不適用於最新的貓頭鷹旋轉木馬2：/我認爲，因爲他們改變了他們如何處理視頻 – Crimbo 2017-01-11 10:35:47

我採取了殘酷的方法，即殺死iframe'$（'SELECTOR iframe'）。prop 'src'，''）'（[source]（http://stackoverflow.com/questions/6145990/how-to-stop-a-vimeo-video-with-jquery）） – Crimbo 2017-01-11 10:58:41

退房的DOC：http://www.owlcarousel.owlgraphic.com/docs/api-events.html

owl.on('changed.owl.carousel', function(event) { 
    $(".owl-carousel video").get(0).pause(); 
})

來源

2015-02-06 18:05:09 mika

我已經試過了。這不會使它工作。我想要的是當我通過鍵盤，拖動，觸摸更改幻燈片或通過導航選擇下一個或前一個幻燈片時暫停我的HTML5視頻。 – 2015-02-06 22:42:03

您需要聽取正確的事件，並找出您需要閱讀文檔。 – mika 2015-02-07 16:03:18

暫停幻燈片上貓頭鷹傳送帶的HTML5視頻

回答

相關問題