Brennrate des $ (window) .scroll-Ereignisses im mobilen Browser
Ich verwende $(window).scroll() event, um Animationen zu meinen Elementen hinzuzufügen.
- In Desktop-Browsern wird das Ereignis ausgelöst, wenn die Maus scrollt .
- In mobilen Browsern wird das Ereignis ausgelöst, wenn drag & amp; touch hat beendet .
Gibt es eine Möglichkeit, das Ereignis scroll() auszulösen, wenn die Berührung gezogen wird (um nach unten / oben zu scrollen)?
Beispielcode:
%Vor%Last, hier ist eine Demoseite (kann JSFiddle nicht gut im Handy verwenden, daher host ich es woanders) . Bitte versuchen Sie es auf Desktop & amp; Mobile Browser Für Ihre Bequemlichkeit, hier ist der QR-Code:
2 Antworten
Ich spiele seit über einer Woche mit Scrollen in Echtzeit in den meisten gängigen Browsern auf Mobilgeräten und Touch-Geräten!
Ich habe viele Ansätze ausprobiert, wie setInterval oder requestAnimationFrame loop setzen oder scroll oder touchmove oder Web Worker oder was auch immer abfangen. Ich kann Ihnen sagen, dass unter iOS 4 - 7 nichts funktioniert, der Browser friert nur die beliebige Skriptausführung ein. Browser für Android, mobile Chrome oder Firefox oder Dolphin track scroll naja, damit kann man mit Schwung dort blättern. Neueste Internet Explorer Mobile, Blackberry, Opera Mobile und die meisten Symbian Browser verfolgen scroll ebenfalls.
Es gibt jedoch eine brillante Möglichkeit, Dinge unter iOS zu tun. Dieser Typ emuliert Scrollen mit CSS3 transform: translateY : Ссылка Eigentlich JavaScript / CSS voll emulieren, was iOS Safari macht nativ.
Dies funktioniert ohne Verzögerungen aufgrund der GPU-Beschleunigung und hat keine Einschränkungen. Sie können sogar Scroll-Parameter wie Reibung oder Empfindlichkeit ändern. Der Nachteil ist, dass Sie nur einen anderen Stil oder Markup für iOS bereitstellen müssen. Sie können dafür Medienabfragen oder Browser-Erkennung verwenden. Bitte finden Sie einige Demos online, da der Autor keine eindeutige Dokumentation zur Verfügung stellt. Beispiel: stellar.js iOS Paralax-Demo. Es sind einige andere Beispiele verfügbar.
Um die aktuelle Bildlaufposition zu verfolgen, verwenden Sie etwas wie folgt:
%Vor% Feuern Sie diese interne requestAnimationFrame-Schleife ab. Leider können Sie die Bildlaufkoordinaten nicht eleganter abrufen als mit WebKitCSSMatrix in dieser Version der Bibliothek. Aber Sie können eine Pull-Anfrage dafür machen.
Hoffe, das wird für dich funktionieren!
Tags und Links jquery