web-dev-qa-db-ja.com

slick.jsのドットをクリックした後、自動再生を停止します

だから、これは私がスライダーに使用するコードです：

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

そして、ユーザーがドットをクリックした後、自動再生が無効になることを望んでいます。それから私はこれを試しました：

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

しかし、助けはありません。これが [〜＃〜] demo [〜＃〜] jsFiddleからです。これはslick.jsで可能ですか？

javascriptjqueryslick.js
5
debute

これを試して

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

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

github-forumの問題の1つから、で初期化する前に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

3
Guruprasad Rao