JavaScript implementiert den nahtlosen Scrolleffekt von Karussellbildern

In diesem Artikel wird hauptsächlich der nahtlose Bildlaufeffekt des js-Karusselldiagramms ausführlich vorgestellt, der einen gewissen Referenzwert hat.

Wenn Sie wissen möchten, wann das Karusselldiagramm beginnt und endet Herstellung Wenn sie nicht verbunden werden können, ist der Effekt etwas hässlich. Hier ist eine Methode, die ich häufig verwende:

Lassen Sie es mich zunächst in Worten erklären:

Wenn Sie 5 anzeigen möchten Bilder, sie sind 1, 2 und 3. ,4,5 Dann ist die Einführung des Codes so: 1,2,3,4,5,1

Ich werde nicht viel darüber sagen sequentielle Rotation hier. Der Fokus ist 5>1 und das Karussell ist 1>5

i stellt den Index des aktuellen Bildes dar

pre stellt die Schaltfläche des vorherigen Bildes dar

next stellt die Schaltfläche des nächsten Bildes dar

ul stellt die Bilderliste dar

(1) 5>1>2... Wenn die Schaltfläche „Weiter“ von 5 auf 1 wechselt, dreht sie sich Normalerweise in der Reihenfolge, und wenn das aktuelle Bild das zweite „1“ ist, sollte das nächste Bild „2“ sein, dann ist der linke Wert von ul bei „next“ 0, i==1; (2) 1>5>4.... Wenn sich die Schaltfläche „Vor“ vom aktuellen Bild „1“ (der ersten 1) zu Bild 5 dreht, i==4, wird der linke Wert von ul zum -5-fachen Die Breite von img, das heißt, die erste 1 wird leise zur letzten 1; es ist etwas verwirrend, sie in der Sprache auszudrücken:

Das Obige ist Ich hoffe, dass der gesamte Inhalt dieses Artikels für das Studium aller hilfreich ist. Ich hoffe auch, dass jeder Duoduo Script House unterstützt.

Das obige ist der detaillierte Inhalt vonJavaScript implementiert den nahtlosen Scrolleffekt von Karussellbildern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!