Add next prev button auf slick karussell

Question

Kürzlich habe ich Slick carousel auf meinem Projekt hinzugefügt.

Lesen dort Dokument Ich habe gesehen, es gibt eine Methode slick Prev() und slick Next().

Aber ich frage Sie, wie verwende ich diese Methode. Ich habe diese lange Zeit versucht, aber ich kann eigentlich nicht verstehen, wie man das mit html button benutzt.

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

Ich habe diesen Weg versucht. Versuchen

Answer 1

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

this zu "#yourid" ändert, wo die yourid die ID des Schiebers ist.

---

Ab Version 1.4 und höher, verwenden Sie:

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

Answer 2

Sie das gleiche tun können, wenn slickPrev Funktion funktioniert nicht. Sie können den Funktionsnamen als Parameter an slick übergeben.

$('.next').click(function(){ 
    $("#sliderId").slick('slickNext'); 
}); 

Answer 3

Die beste Weise, die ich das tun gefunden, ist dies. Sie können meinen HTML-Code entfernen und ihn dort platzieren.

$('.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>' 
}); 

Answer 4

1. Initialisieren Sie Schieber in Ihrer Script-Datei und fügen Sie die Einstellungen möchten Sie wie folgt aus:

$('.my-slider').slick({ 
 
    arrows: true, 
 
    prevArrow: '<div class="slick-prev"><</div>', 
 
    nextArrow: '<div class="slick-next">></div>' 
 
});

2. Stil die Klassen slick-prev und slick-next