带滑动滑块的Jquery滑块

我想要在hquery标签中使用多个滑块，这个想法是每个标签都是Woocommerce中的一个类别，但我现在只是将它们硬编码以便最初让它们工作。带滑动滑块的Jquery滑块

问题是，当我将滑块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, 
});

来源

2016-05-14 PhpDude

你犯了一个错误与您的选择：$('.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

来源

2016-05-14 11:13:26 lithium

嘿，感谢您的回答，我现在看到的我的方法错误，我已经发现了一些有点奇怪。当你点击标签时，滑块加载样式几乎需要时间？ – PhpDude

我认为这是因为jQuery中的'show'和'hide'，每次都必须重新创建滑块。我稍后再看看。 – lithium

谢谢你，我只是努力克服这一点。 – PhpDude

带滑动滑块的Jquery滑块

回答

相关问题