单击slick.js中的点后停止自动播放

Question

所以，这是我用于滑块的代码：

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

我希望用户点击任何一个点后，它将禁用自动播放。然后我尝试了这个：

$('.autoplay').on('init', function() {
    $('.slick-dots').click(function() {
        $('.autoplay').slick('autoplay', false);
    });
});

但没有帮助。这是来自jsFiddle的DEMO。这可能是slick.js吗？

Answer 1

试试这个

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

$('.slick-dots').on('click', function() {
    $('.autoplay').slick('slickPause');
});

Answer 2

从 github-forum 中的一个问题，我发现在使用init进行初始化之前，您必须附加slick个事件。

$('.autoplay').on('init', function(slick) {
    $('.slick-dots').on('click',function() {
        $('.autoplay').slick('slickPause');
    });
}).slick({
    slidesToShow: 3,
    slidesToScroll: 1,
    dots: true,
    autoplay: true,
    autoplaySpeed: 2000,
})

<强>

的 DEMO HERE