在光滑的旋转木马上添加下一个上一个按钮

Question

最近我在我的项目中添加了Slick轮播.

阅读那里的文件,我已经看到有一种方法slick Prev()和slick Next().

但我问你如何使用这种方法.我已经尝试了很长时间,但实际上我无法理解如何使用它html button.

$('button.next').click(function() {
    $(this).slickPrev();
});

我试过这种方式.

Answer 1

$('button.next').click(function(){
    $("#yourid").slickPrev();
});

尝试改变this,以"#yourid"其中yourid的滑块的ID.

从版本1.4及更高版本开始,使用:

$('button.next').click(function(){
    $("#yourid").slick('slickPrev');
});

Answer 2

我的和上面一样，但可能有点不同，我认为更好理解：

$('.responsive').slick({
   dots: true,
   prevArrow: $('.prev'),
   nextArrow: $('.next'),
   infinite: false,
   speed: 300,
   slidesToShow: 3,
   slidesToScroll: 1,
   autoplay: true,
   autoplaySpeed: 5000,
});


<div class="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
</div>
<div class="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
</div>

Answer 3

我发现做到这一点的最佳方式就是这样。你可以删除我的 HTML 并将你的放在那里。

$('.home-banner-slider').slick({
    dots: false,
    infinite: true,
    autoplay: true,
    autoplaySpeed: 3000,
    speed: 300,
    slidesToScroll: 1,
    arrows: true,
    prevArrow: '<div class="slick-prev"><i class="fa fa-angle-left" aria-hidden="true"></i></div>',
    nextArrow: '<div class="slick-next"><i class="fa fa-angle-right" aria-hidden="true"></i></div>'
});