Czy można ukryć pasek adresu i pasek stanu w iOS 7 Safari?


12

Czy można ukryć pasek adresu i pasek stanu w iOS 7?

W aplikacji poziomej używam obecnie poniższego kodu, aby zrobić to dla poprzednich wersji iOS i działa dobrze nawet na IOS 7: po otwarciu strony przechodzi na pełny ekran i tak jest.

JS:

window.addEventListener("load",function() {
    // Set a timeout...
    setTimeout(function(){
        // Hide the address bar!
        window.scrollTo(0, 1);
    }, 0);
});

HTML:

<!-- For iOS web apps -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="AMC Walking Dead Story Sync">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

Faktem jest, że na iOS 7 iPhone i iPad po dotknięciu dolnej części ekranu pojawia się pasek adresu i pasek stanu, a jedynym sposobem na pozbycie się go jest zmiana orientacji telefonu, a następnie powrót do poprzedniej orientacji. Czy istnieje sposób na uniknięcie tej manipulacji?


Wiele odpowiedzi na ten już stackoverflow.com/questions/18813476/…
AllInOne

Nie widzę odpowiedzi na SO, która działa lepiej niż przykładowy kod tutaj. Hmm ...
bmike

Odpowiedzi:


15

Istnieje metoda:<meta name="viewport" content="minimal-ui”>
( ale działa tylko na iOS 7.1 - nie na 7.0 ani 8.0 )

źródło: StackOverflow


Więcej szczegółów z dziennika zmian i informacji o wersji iOS 7.1 beta 2 :

Notatki Safari

Dodano właściwość minimal-ui dla klucza metatagu rzutni, który pozwala zminimalizować górny i dolny pasek na iPhonie podczas ładowania strony. Podczas korzystania ze strony przy użyciu minimalnego interfejsu użytkownika stuknięcie górnego paska przywraca paski. Stuknięcie w treść ponownie powoduje ich odrzucenie.

Na przykład użyj <meta name=”viewport” content=”width=1024, minimal-ui”>.


aktualizacja: Potwierdziłem, że ta metoda działa w iOS 7.1 (oficjalna wersja ostateczna). Możesz sam potwierdzić swoją aplikacją internetową , która korzysta z opisanego powyżej rozwiązania z metatagiem.

wprowadź opis zdjęcia tutaj


Poczekam na ostateczne wydanie, a następnie spróbuję, a następnie zaakceptuję twoją odpowiedź. Wielkie dzięki.
svassr

Hmmmm Korzystam z wersji 7.1.1, a twoja aplikacja internetowa, do której prowadzi link, NIE ukrywa paska adresu itp. Po załadowaniu. Czy złamali go w 7.1.1?
Brian B

7
Zostało to usunięte w iOS8.
Charlie Schliesser

1
Sprawdź ten post na temat implementacji IOS8: stackoverflow.com/questions/24889100/…
svassr

1

Widziałem to zalecane. <meta name="apple-mobile-web-app-capable" content="yes"> Prowadzi witrynę w trybie autonomicznym, w którym ukrywa się interfejs użytkownika. Nie jestem pewien, jak to się ma do powyższego rozwiązania minimalnego interfejsu użytkownika. Mam wrażenie, że to rozwiązanie działa również w wersjach iOS starszych niż 7.1.


5
To rozwiązanie działa tylko w przypadku stron internetowych dodanych jako aplikacja do ekranu głównego.
svassr
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.