SlickスライドのJqueryスライダー

Question

hqueryタブ内に複数のスライダーを入れたいと思っていますが、各タブはWoocommerceのカテゴリになりますが、現在はそれらを最初にハードコーディングして動作させています。

スライダが表示されなくなったタブコードにスライダhtmlを移動すると問題が発生しますか？私が理解し、私は私が必要とするループに入れて鶏にできていますこの問題を克服したらJSFIDDLE

：

は、ここに私の問題の正確なレプリカです。

$('.tabs-nav a').on('click', function (event) { 
    event.preventDefault(); 

    $('.tab-active').removeClass('tab-active'); 
    $(this).parent().addClass('tab-active'); 
    $('.tabs-stage div').hide(); 
    $($(this).attr('href')).show(); 
}); 

$('.tabs-nav a:first').trigger('click'); // Default 


////////////////////////////////////////////////////////////// 


$('.slider').slick({ 
    slidesToShow: 3, 
    slidesToScroll: 1, 
    autoplay: true, 
    autoplaySpeed: 2000, 
}); 

Answer 1

あなたのセレクタでミスをした：$('.tabs-stage div').hide(); をこれがhie every div inside '.tabs-stage' and his childrenので、すべてのdivを隠してされているので、あなたが$($(this).attr('href')).show();でアクティブなスライダーを表示したときに、それが唯一のスライダーではなく、まだ隠されているその中のdivを表示することを意味。

$('.tabs-stage > div').hide();（彼は>）このようにして、直接子供を非表示にするのは.tabs-stageです。

You FIDDLE edited