iPad WebApp na pełnym ekranie w Safari

83

Apple mówi w dokumencie Safari HTML, że poniższy kod ma sprawić, że aplikacja internetowa będzie pełnoekranowa w systemie iPhone OS 2.1 i nowszych.

 <meta name="apple-mobile-web-app-capable" content="yes">

Ale to nie działa. Czy istnieje sposób na ukrycie paska tytułu / lokalizacji w przeglądarce Safari w aplikacji internetowej na iPada?

ipad web-applications iphone-standalone-web-app ChrisB
źródło

Odpowiedzi:

120

Działa to tylko po zapisaniu zakładki w aplikacji na ekranie głównym. Nie, jeśli po prostu przeglądasz witrynę w normalny sposób.

jamone
źródło
13
Jeśli dodasz ten metatag do starej strony internetowej z adresem URL, którą przeglądałeś wcześniej w Safari, musisz najpierw odświeżyć adres URL, a następnie dodać go do ekranu głównego, aby metatag działał.
Scott Chu,
To nie działa dla mnie w przypadku projektu Laravel. Dodałem to do mojego szablonu układu app.blade. Jest używany przez każdą z moich stron, więc nagłówek powinien (i tak jest) pojawiać się na każdej stronie. Jednak nadal mam paski Safari na moim iPhonie i iPadzie, nawet po wykonaniu wielu testów, aby wyczyścić pamięć podręczną, ponownie utwórz skrót na ekranie głównym, jak wspomniano w tym poście. Czy jest coś jeszcze, co mogłoby zapobiec ukryciu się barów safari? pastebin.com/iSFDXjFz tutaj jest sekcja główna mojego pliku app.blade.php. Z góry dziękuję.
Frantumn
14

Jeśli chcesz pozostać w przeglądarce bez otwierania nowego okna, użyj tego kodu HTML:

<a href="javascript:this.location = 'index.php?page=1'">
Remco de Jong
źródło
4
Wydaje się, że nie ma to związku z danym pytaniem lub tematem. Może mógłbyś wyjaśnić, jak to się wiąże?
skeggse
6
Bardzo istotne. Jest to zawsze kolejny problem po wyświetleniu pełnego ekranu aplikacji internetowej.
Shrimpwagon
Dla mnie następnym problemem jest „jak odświeżyć stronę teraz, gdy jest w trybie pełnego ekranu?”
Nick
13

  1. Najpierw uruchom przeglądarkę Safari z ekranu głównego i przejdź do strony internetowej, którą chcesz wyświetlić na pełnym ekranie.

  2. Po zlokalizowaniu strony internetowej dotknij ikony strzałki u góry ekranu.

  3. W menu rozwijanym dotknij opcji Dodaj do ekranu głównego.

  4. Powinno zostać wyświetlone okno Dodaj do strony głównej. Możesz dostosować opis, który pojawi się jako tytuł na ekranie głównym iPada. Kiedy skończysz, stuknij w przycisk Dodaj.

  5. Nowa ikona powinna teraz pojawić się na ekranie głównym. Dotknięcie ikony otworzy stronę internetową w trybie pełnoekranowym.

Uwaga: ikona na ekranie głównym iPada otwiera stronę z zakładkami tylko w trybie pełnoekranowym. Następna odwiedzona strona będzie zawierała adres Safari i paski tytułu. Ten sposób odtwarzania strony internetowej lub prezentacji HTML5 w trybie pełnoekranowym działa, jeśli kod źródłowy strony zawiera następujący tag:

<meta name="apple-mobile-web-app-capable" content="yes">

Możesz dodać ten tag do swojej strony internetowej za pomocą narzędzia innej firmy, na przykład iWeb SEO Tool lub innego, które lubisz. Pamiętaj, że najpierw musisz dodać tag, odświeżyć stronę, a następnie dodać zakładkę do ekranu głównego.

Kod Miasto
źródło
Można powiedzieć, że jest to bezpośrednia kopia instrukcji znajdującej się pod adresem ispringsolutions.com/articles/ ... :-)
Jochem Schulenklopper
3
A może skopiowali moje. :) Spójrz na datę, w której odpowiedziałem na to pytanie i porównaj ją z datą ich publikacji.
Code.Town
Twoje zdrowie! To rodzaj ciebie. :)
Code.Town
7

Otwiera tylko pierwszą (dodaną do zakładek) stronę na pełnym ekranie. Każda następna strona zostanie otwarta Z ponownie widocznym paskiem adresu. Niezależnie od tego, jaki metatag umieścisz w nagłówku strony ...

Joop Stringer
źródło
stackoverflow.com/questions/6429492/…
Alpha Codemonkey
0

Wygląda na to, że większość odpowiedzi w tym wątku nie dotrzymała Ci kroku. iOS Safari na iPadach obsługuje teraz tryb pełnoekranowy i jest bardzo łatwy do wdrożenia za pomocą JavaScript.

Oto mój pełny artykuł na temat wdrażania funkcji pełnoekranowych w Twojej aplikacji internetowej.

Marvin Danig
źródło