debute debute - 5 months ago 317
jQuery Question

Stop autoplay after clicking on dots in slick.js

So, this is code I use for slider:

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


And I want that after user clicks on any dot, it will disable autoplay. Then I tried this:

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


But no help. Here is DEMO from jsFiddle. Is this possible with
slick.js
?

Answer

Try this

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

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