光滑的滑块选项会发生变化

Posted 2021-04-12

我想知道是否有办法将新选项传递给已创建的Slick轮播？我有这个代码：

$('.bottom-slider').slick({
  asNavFor: '.top-slider',
  slidesToShow: 3,
  slidesToScroll: 1,
  variableWidth: true,
  centerMode: true,
  etc...
});

并且在某个时刻（将CSS类添加到restyle滑块）我想将slidesToShow: 5传递给carousel。我试过了

$('.bottom-slider').slick({slidesToShow: 5}); 

但它不起作用。可能吗？我不想破坏/再次运行滑块或创建带有“重新设计”轮播的第二个框。

答案

光滑的滑块提供slickSetOption方法来做到这一点。

另一答案

我在slickSetOption上发现website的描述有点令人困惑，所以在这里留下几个例子。

设置单个选项而不刷新UI：

        $('.initialized-carousel').slick('slickSetOption', 'slidesToShow', 3);

使用UI刷新设置多个选项：

        $('.initialized-carousel').slick('slickSetOption', {
            slidesToShow: 3,
            slidesToScroll: 1
        }, true);