私は奇妙なものを持っています。cycle2 を使用したスライドショーがうまく機能します。HTMLで次のように初期化しています:
<div class="content-slide-show cycle-slideshow" data-slides=".slide" data-next=".cycle-slideshow .next-slide" data-previous=".cycle-slideshow .previous-slide">
initialized
そして、私destroyed
は
var contentslideShowElement = $('.content-slide-show');
contentslideShowElement.on( 'cycle-initialized', function() {
contentSlideShowInitialized = true;
});
contentslideShowElement.on( 'cycle-destroyed', function() {
contentSlideShowInitialized = false;
});
次に、使用してウィンドウのサイズ変更を監視する
$(window).resize(function(){
destroyContentSlideShowForMobile();
});
function destroyContentSlideShowForMobile(){
if( contentSlideShowInitialized && $(window).width() < 768 ){
contentslideShowElement.cycle('destroy');
}
if( !contentSlideShowInitialized && $(window).width() > 768 ){
contentslideShowElement.cycle();
}
}
基本的に、スライドショーがスライドショーで、ブラウザのサイズが 768 未満に変更された場合、スライド ショーは破棄されます (その後、CSS はコンテンツを中継する場合を想定します)。
もう 1 つの状態では、スライドショーが削除されたかどうかを確認し、ブラウザのサイズが 768 を超えてサイズ変更され、サイクルが再初期化されます。
両方のイベントが機能しているように見えます (サイクルのログのように、正しい時間にそれが行われていると言っています[cycle2] cycle-destroyed
が[cycle2] --c2 init--
、再初期化されると機能しません。
何か案は?