web-dev-qa-db-ja.com

SafariでのiPad WebAppフルスクリーン

Appleは Safari HTMLリファレンス で、以下のコードはiPhone OS 2.1以降でWebアプリを全画面表示することになっていると述べています。

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

しかし、うまくいかないようです。 iPad WebAppのSafari内でタイトル/ロケーションバーを非表示にする方法はありますか？

ipadweb-applicationsiphone-standalone-web-app
80
ChrisB

これは、アプリのブックマークをホーム画面に保存した後にのみ機能します。普通にサイトを閲覧するだけではない。

115
jamone

新しいウィンドウを起動せずにブラウザーにとどまる場合は、次のHTMLコードを使用します。

<a href="javascript:this.location = 'index.php?page=1'">
13
Remco de Jong

  1. 最初に、ホーム画面からSafariブラウザーを起動し、全画面表示するWebページに移動します。

  2. ウェブページを見つけたら、画面上部の矢印アイコンをタップします。

  3. ドロップダウンメニューで、[ホーム画面に追加]オプションをタップします。

  4. [ホームに追加]ウィンドウが表示されます。 iPadのホーム画面にタイトルとして表示される説明をカスタマイズできます。完了したら、[追加]ボタンをタップします。

  5. 新しいアイコンがホーム画面に表示されます。アイコンをタップすると、ウェブページが全画面モードで開きます。

注：iPadのホーム画面のアイコンは、ブックマークされたページを全画面モードでのみ開きます。次にアクセスするページには、Safariのアドレスとタイトルバーが含まれます。 WebページまたはHTML5プレゼンテーションを全画面モードで再生するこの方法は、Webページのソースコードに次のタグが含まれている場合に機能します。

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

このタグは、iWeb SEO Toolなどのサードパーティツールを使用してWebページに追加できます。最初にタグを追加し、ページを更新してから、ホーム画面にブックマークを追加する必要があることに注意してください。

12
Code.Town

最初の（ブックマークされた）ページ全画面のみを開きます。次のページが開き、アドレスバーが再び表示されます。ページヘッダーに挿入するメタタグは何でも...

7
Joop Stringer

このサイトには回避策があり、同じ効果があります。JavaScriptを使用して、最初の子divをビューポートの全高に設定します。 http://webapp-net.com/Demo/Index.html

1
xiatica

このスレッドに関するほとんどの答えが追いついていないようです。 iPad上のiOS Safariには フルスクリーンサポート があり、javascriptを使用して実装するのは非常に簡単です。

Webアプリにフルスクリーン機能を実装する方法について、私の完全な 記事 をご覧ください。

0
marvindanig