2016-09-30 2 views
0

Es gibt eine Million ähnliche Fragen, aber ich kann keine Antwort finden, die für mich funktioniert. HierVertikale Scroll auf Handy - Hammer.js Element auf Seite

ist die Situation:

ich eine HTML-Seite habe, und innerhalb dieser Seite ist ein Element, das ich hammer.js auf verwenden.

Need wie diese scrollen zu: image ---> image

Während auch Pinch-to-Zoom (auf diesem gezoomte Elemente und anschließend schwenkt) auf dem Sitzdiagrammelement in der Lage, über.

Das Element selbst funktioniert perfekt. Ich verwende doubletap, pinch, pinchend, pan und panend darauf.

Jetzt, wenn das Element vollständig ausgezoomt ist (ich behalte den Maßstab aus diesem Grund), würde ich gerne die gesamte Seite scrollen, wenn Sie es auf einem mobilen Browser verwenden (aka der Finger wird) ziehe die Seite hoch).

Ich habe fast alles unter der Sonne an dieser Stelle versucht. Ich kann nicht scheinen, um manuell zu einer bestimmten Position zu scrollen (Ich habe versucht, window.scrollTop und window.scrollTo() ohne Ergebnisse zu verwenden).

Wenn mir jemand in die richtige Richtung zeigen könnte, werde ich dich und deine Familie für die nächste ... sagen .... sagen .... 13 Tage. Heck, vielleicht sogar 14.

TL; DR - Haben wir das Element gezoomt? Wenn dies der Fall ist, packen Sie dieses Element mit Freude durch! - Sind wir vollständig herausgezoomt? Wenn dies der Fall ist, sollten mobile Nutzer die Seite wie gewohnt scrollen können!

Dank Chris

Antwort

1

Sie können window.scrollTo versuchen zu normaler Scroll "zu simulieren". So ähnlich:

var currentScroll = 0; 
var currentScale = 1; //"fully zoomed out" state 

hammer.on("panstart", function (ev) { 
    currentScroll = window.scrollY; 
}); 

hammer.on("pan", function(ev) { 
    if (currentScale == 1) { 
    //abort pan and scroll window instead 
    window.scrollTo(0, currentScroll + ev.deltaY * -1); 
    return; 
    } 

    //do stuff with pan here... 

}); 
Verwandte Themen