web-dev-qa-db-ger.com

iPad WebApp Vollbild in Safari

Apple sagt in der Safari HTML-Referenz , dass der folgende Code die Web-App auf dem iPhone OS 2.1 und höher als Vollbild anzeigen soll.

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

Aber es scheint nicht zu funktionieren. Gibt es eine Möglichkeit, die Titel-/Adressleiste in Safari in einer iPad WebApp auszublenden?

80
ChrisB

Dies funktioniert nur, nachdem Sie ein Lesezeichen in der App auf dem Startbildschirm gespeichert haben. Nicht, wenn Sie nur normal zur Site navigieren.

115
jamone

Wenn Sie in einem Browser bleiben möchten, ohne ein neues Fenster zu öffnen, verwenden Sie diesen HTML-Code:

<a href="javascript:this.location = 'index.php?page=1'">
13
Remco de Jong
  1. Starten Sie zunächst Ihren Safari-Browser vom Startbildschirm aus und rufen Sie die Webseite auf, die Sie im Vollbildmodus anzeigen möchten.

  2. Tippen Sie nach dem Aufrufen der Webseite oben auf dem Bildschirm auf das Pfeilsymbol.

  3. Tippen Sie im Dropdown-Menü auf die Option Zum Startbildschirm hinzufügen.

  4. Das Fenster Zur Startseite hinzufügen sollte angezeigt werden. Sie können die Beschreibung anpassen, die als Titel auf dem Startbildschirm Ihres iPad angezeigt wird. Wenn Sie fertig sind, tippen Sie auf die Schaltfläche Hinzufügen.

  5. Auf Ihrem Startbildschirm sollte jetzt ein neues Symbol angezeigt werden. Durch Tippen auf das Symbol wird die Webseite im Vollbildmodus geöffnet.

Hinweis: Das Symbol auf Ihrem iPad-Startbildschirm öffnet nur die mit einem Lesezeichen versehene Seite im Vollbildmodus. Die nächste Seite, die Sie besuchen, enthält die Safari-Adresse und die Titelleiste. Diese Art der Wiedergabe Ihrer Webseite oder HTML5-Präsentation im Vollbildmodus funktioniert, wenn der Quellcode der Webseite das folgende Tag enthält:

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

Sie können dieses Tag mit einem Tool eines Drittanbieters, z. B. iWeb SEO Tool oder einem beliebigen anderen Tool, zu Ihrer Webseite hinzufügen. Bitte beachten Sie, dass Sie zuerst das Tag hinzufügen, die Seite aktualisieren und dann ein Lesezeichen zu Ihrem Startbildschirm hinzufügen müssen.

12
Code.Town

Es wird nur die erste (mit einem Lesezeichen versehene) Seite im Vollbildmodus geöffnet. Jede nächste Seite wird mit der wieder sichtbaren Adressleiste geöffnet. Welches Meta-Tag auch immer Sie in Ihren Seitenkopf einfügen ...

7
Joop Stringer

Diese Seite hat eine funktionierende Problemumgehung, derselbe Effekt, verwendet etwas Javascript, um das erste untergeordnete Div auf die Gesamthöhe des Ansichtsfensters einzustellen. http://webapp-net.com/Demo/Index.html

1
xiatica

Es sieht so aus, als ob die meisten Antworten in diesem Thread nicht mithalten konnten. iOS Safari auf iPads hat Vollbild-Unterstützung jetzt und es ist sehr einfach mit Javascript zu implementieren.

Hier ist mein vollständiger Artikel zum Implementieren der Vollbildfunktion in Ihrer Web-App.

0
marvindanig