Hinzufügen von Paging-Steuerelementen zu einer vollständigen Seite Touch Swiper / Slider - Hammer.js

8

KLICKE FÜR FIDDLE

Im Folgenden finden Sie einen voll funktionsfähigen Schieberegler für die gesamte Seitenfläche , den ich mit erstellt habe hammer.js

Sie können drag , swipe oder pan verwenden, um zwischen den Seiten zu navigieren.

Der Slider funktioniert wie erwartet, aber ich versuche nun, Fallback-Navigation durch Hinzufügen von zwei Schaltflächen zu erstellen, so dass Paging nach links und rechts auch bei Klick auftreten kann.

FRAGE

Wie kann der Hammer nach links oder rechts gewischt werden? (Javascript oder jQuery).

AKTUELLER VERSUCH

%Vor%

VOLLER CODE

%Vor% %Vor% %Vor%
    
Obsidian 04.03.2015, 15:36
quelle

1 Antwort

2

Ich habe dafür eine jQuery-Lösung entwickelt, die die von Ihnen gesuchte Ausweichlösung erfüllen soll.

Einige Dinge zu beachten. Auch in Ihrem Beispiel wird die Seitengröße nicht berücksichtigt. Ich habe dies auch nicht getan, um konsistent zu bleiben und das unmittelbare Problem zu lösen, aber Sie werden feststellen, dass ich die Variable $('.Page').width(); als Variable in dieser Lösung verwende. Ich würde empfehlen, diesen Wert erneut zuzuweisen, wenn Sie die Größenanpassung berücksichtigen. Auch eine Mischung aus Wischen / Klicken löst dies aus. Ich nehme an , da Sie angegeben haben, dass dies ein Fallback ist, erhält der Benutzer eine der beiden Erfahrungen. Wenn nicht, müssen wir auch tracker bei Swipe-Ereignissen aktualisieren.

Sie werden var tracker = { 'R': 0 } bemerken. Während die Benennung von darf nicht die beste sein, wird 'R' dafür verantwortlich sein, wie viele richtige "Swipes" (Navigationsklicks) der Benutzer in einer Plus / Minus-1-Weise ausgeführt hat

%Vor% %Vor%

JSFiddle-Link

    
scniro 21.04.2015, 18:47
quelle