iOS 7 - czy istnieje sposób na wyłączenie funkcji przesuwania do tyłu i do przodu w Safari?

82

W przypadku niektórych stron internetowych używamy funkcji przesuwania palcem w lewo iw prawo na iPhonie, aby wyświetlić menu. Teraz z iOS7 wprowadzili możliwość przechodzenia wstecz i do przodu do poprzednich i następnych stron historii przeglądarki za pomocą ruchów przesuwania palcem w lewo i w prawo.

Ale czy istnieje sposób na wyłączenie go dla określonych stron, aby nie powodować konfliktów podczas operacji przesuwania?

ios safari ios7 MeghaK
źródło
Powinien wyróżniać się przesuwaniem rozpoczynającym się poza ekranem. Czy masz przykładową stronę internetową, na której występuje konflikt?
Rupert Rawnsley
@RupertRawnsley Dodaj zdarzenie touchstart / touchmove do swojej strony internetowej za pomocą console.log ('WYPALANE!'); w tym. Przesuń palcem po stronie internetowej od krawędzi, a zauważysz, że zdarzenie nigdy się nie uruchamia. Czy mam rację, zakładając, że będzie to nowe oczekiwane zachowanie?
Marcus
2
+1 za to. Kłopotliwe, gdy przesuwasz palcem, aby otworzyć menu.
TYRONEMICHAEL
2
+1 Użytkownik nie ma pojęcia, czym jest przesunięcie poza ekran, a czym jest przesunięcie na ekranie. Blergh!
Joseph Juhnke,
1
Jako użytkownik ze słabym wzrokiem muszę dużo powiększać i przesuwać, ten gest przesunięcia w tył doprowadza mnie do szaleństwa. Jeśli ktoś wie, jak to wyłączyć, chcę wiedzieć.
Brett Ryan

Odpowiedzi:

12

Nie możesz go wyłączyć bezpośrednio, ale natywne przesunięcie z powrotem dzieje się tylko wtedy, gdy coś jest w historii przeglądarki.

Nie będzie działać w każdym przypadku, ale jeśli masz pojedynczą aplikację internetową otwartą w nowej karcie, możesz zapobiec dodawaniu jej do historii, używając

window.history.replaceState(null, null, "#" + url)

zamiast pushState lub 

document.location.hash = url
Tom Clarkson
źródło
5
Tak, ale to zapobiega tylko historii w samej aplikacji podczas nawigacji. Inne aplikacje również mogły wypchnąć historię, dlatego iOS również wykryje te historie.
koleś
5

Musiałem użyć 2 podejść:

1) Poprawka CSS tylko dla Chrome / Firefox

html, body {
    overscroll-behavior-x: none;
}

2) Poprawka JavaScript dla Safari

if (window.safari) {
    history.pushState(null, null, location.href);
    window.onpopstate = function(event) {
        history.go(1);
    };
}

Z czasem Safari zaimplementuje overscroll-behawior-x i będziemy mogli usunąć hack JS

John Doherty
źródło
Dodałem to i na Macu zapobiega to cofaniu się przesunięcia w lewo. Jednak całkowicie psuje funkcjonalność wsteczną (w tym przycisk Wstecz), więc nie można go użyć jako obejścia.
Šime Vidas,
W moim przypadku taki był cel, ponieważ
John Doherty,
2
Jednak nadal istnieje możliwość, że ktoś otworzy Twoją aplikację, klikając łącze w innej witrynie (tj. Jeśli ta witryna zawiera link do Twojej aplikacji). Aby to naprawić, nadal musiałbyś wykrywać gesty machnięcia za pośrednictwem touchmovezdarzeń i wykonywać powyższy kod tylko wtedy, gdy nie był on bezpośrednio poprzedzony przesunięciem. Powinno być możliwe.
Šime Vidas
Zaktualizowałem to, aby uwzględnić opcję CSS tylko dla Chrome i Firefox
John Doherty,
Czy na pewno to działa na iOS? Właśnie przetestowałem overscroll-behavior-x: none;w Chrome na iOS 13 i nie miało to żadnego wpływu na zachowanie nawigacji poprzez przesuwanie. Przesunięcie w prawo przy lewej krawędzi powoduje cofnięcie się (i nawet jeśli jest to pierwsza strona w historii kart, nadal wraca do ekranu głównego).
naktinis