2016-09-06 19 views
0

複数のjqueryタブにスライダーを追加しようとしていますが、スライダーを正しく表示するために幅と高さが必要なため、タブが変更されたときにwindow resizeトリガーを呼び出す必要があります。このコードは動作しますが、一度だけ動作します:jQueryウィンドウサイズ変更トリガーのみ一発点

私はこれをドキュメント(準備完了)機能の外側に配置しましたが、これはまだ1回しか動作しません。

これは私の完全なスクリプトです:

jQuery(document).ready(function($){ 
    $('.slider-<?= $name ?>').slick({ 
     slidesToShow: 1, 
     centerMode: true, 
     centerPadding: '200px', 
     arrows: true, 
     focusOnSelect: true, 
     responsive: [ 
      { 
       breakpoint: 800, 
       settings: { 
        centerMode: false 
       } 
      } 
     ] 
    }); 
}); 

jQuery(".vc_tta .vc_tta-tab, .vc_tta .vc_tta-panel-title").click(function() { 
    jQuery(window).trigger("resize"); 
}); 

私はWordPressでビジュアルコンポーザを使用していて、私は正確に複製することはできませんが、これは同じ問題である:https://jsfiddle.net/keithpetrillo/d9jrgs80/

+0

コンソールエラーが発生しましたか? –

+0

いいえ、コンソールには何も表示されません –

+0

残りの部分はタブで隠されているため、表示されている要素に対してのみ一度だけ動作するか、または動作しますか? – isherwood

答えて

1

機能を移動する必要はありません外側document.ready。ドキュメントからイベントを委任してみてください:

これは、ページの読み込み時に存在しないか、表示されていない要素に対して有効です。

+0

それは動作しますが、一度だけです:(最初のタブはクリックしても問題ありません) –

+0

あなたが私たちに与えてくれたことから難しいです。デモ? – isherwood

+0

はい、私は上記の質問を更新しました –

関連する問題