Pytanie Tworzenie "lepkiej" pozycji o ustalonej pozycji działającej w Safari na iOS


W Safari iOS przesuwanie jednym palcem nie generuje żadnych zdarzeń, dopóki użytkownik nie przestanie przesuwać. Zdarzenie onscroll jest generowane tylko wtedy, gdy strona przestaje się poruszać i przerysowywać.

Potrzebuję sposobu na wykrycie przewijania w czasie rzeczywistym. W szczególności chcę stworzyć lepkie menu, które będzie działać również na iOS safari. W przeglądarkach innych niż mobilne, lepkie menu można zrobić, przełączając się pomiędzy "pozycją względną" i "pozycją ustaloną" na elemencie podczas słuchania zdarzeń onscroll. Ta metoda nie działa w przeglądarce mobilnej, ponieważ zdarzenia onscroll nie są uruchamiane w sposób ciągły. Co mogę zrobić?


18
2017-11-12 21:35


pochodzenie


Jednym (choć hackerskim) sposobem na jego wdrożenie może być rozpoznanie własnego pionowego gestu Pan i dodanie go do widoku internetowego. W ten sposób można użyć właściwości -state do odbierania zdarzeń. - CodaFi
bind to touch move i monitoruj y strony - sciritai


Odpowiedzi:


Odpowiadając na moje własne pytanie. iOS7 obsługuje teraz pozycję: lepkie Próbny: http://html5-demos.appspot.com/static/css/sticky.html


11
2017-10-11 14:38





Ostatnio wiele godzin spędziłem na próbach znalezienia praktycznego rozwiązania tego samego problemu. Nie ma sposobu, aby to zrobić, chociaż istnieje kilka przyzwoitych hacków (większość z nich już wspomniano). Problem polega na tym, że JavaScript jest wstrzymywany, gdy użytkownik przewija. Ma to sens, gdy bierze się pod uwagę implikacje, ale sprawia, że ​​trudno jest zaimplementować stały element pozycjonowany.

Najlepszą rzeczą, jaką udało mi się znaleźć, jest ten wspaniały post ludzi w Google. Możesz sprawdzić http://gmail.com w mobilnym safari, aby zobaczyć to w akcji.

https://developers.google.com/mobile/articles/webapp_fixed_ui

Mam nadzieję że to pomoże.


3
2017-08-21 18:09



Ten link przekierowuje na stronę główną programistów. Najlepsze, co mogłem znaleźć, to archiwum.org: web.archive.org/web/20141001100814/https://... - duncan


Miałem podobny problem i związane procedury obsługi do touchstart / touchmove / touchend przy użyciu jquery, aby wykryć przewijanie jednym palcem i działało idealnie. W moim przypadku musiałem przesunąć kolejny element o taką samą ilość, jak próba przeniesienia innego elementu i ładnie się zaktualizował, tak jak próbował przewijać, więc powinien być odpowiedni do twoich wymagań.


2
2017-10-02 15:17





Jeśli wszystko, czego chcesz, to lepkie menu, możesz zaoszczędzić sobie bólu głowy, korzystając z istniejącej biblioteki. Miałem sukces z iScroll:

http://cubiq.org/iscroll

Przynajmniej możesz rzucić okiem na to, jak to działa i oprzeć swoje rozwiązanie wokół tego.

Szczęśliwy hacking!


0
2017-12-13 19:45





Stary temat na pewno, ale widzę tu wiele wizyt. Jeśli chcesz, to jest lepkie menu, możesz użyć stałego pozycjonowania. Nie potrzebujesz tam iScroll.


-3
2017-08-20 14:24



Należy podkreślić, że ustalone pozycjonowanie nie jest obsługiwane w wielu przeglądarkach mobilnych. Więcej tutaj: bradfrostweb.com/blog/mobile/fixed-position - Jonathan Stark
Należy podkreślić, że osoba zadająca pytanie, znalazła rozwiązanie z dużo mniejszym wsparciem niż moje rozwiązanie ... i nie zgadzam się z twoim stwierdzeniem dotyczącym wsparcia stanowiska: naprawiono: caniuse.com/css-fixed - curly_brackets
Czego się nie zgadzać? "Częściowe wsparcie w Safari na iOS odnosi się do błędnego zachowania." Czy zachowanie błędów w ~ 50% przeglądarek mobilnych jest dla ciebie akceptowalne? - Thomas McCabe