web-dev-qa-db-ja.com

Safariのアドレスバーとフッターを非表示にする

私のjQueryMobileプロジェクトでは、次のコードを使用しています。

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">

Safariブラウザのアドレスバーとナビゲーションフッターを取得しています。それらを非表示にして、アプリを表示させるにはどうすればよいですか？

jquery-mobilesafariviewport
19
Satch3000

いくつかのメタタグを設定して、サイトをWebアプリとしてホーム画面に追加できることをiOSに通知できます。そこから起動すると、Safari要素はすべて非表示になります。

「Safariユーザーインターフェイスコンポーネントの非表示」というタイトルのセクションを確認してください ここ 。

ホーム画面に表示されるアプリの起動スプラッシュ画面の画像とカスタムアイコンを指定できます。

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
<meta name="Apple-mobile-web-app-capable" content="yes" />
<meta name="Apple-mobile-web-app-status-bar-style" content="black" />
<link rel="Apple-touch-icon" href="Apple-touch-icon-57x57.png" />
<link rel="Apple-touch-icon" sizes="72x72" href="Apple-touch-icon-72x72.png" />
<link rel="Apple-touch-icon" sizes="114x114" href="Apple-touch-icon-114x114.png" />
<link rel="Apple-touch-startup-image" href="Apple-touch-startup-image-320x460.png" />
<link rel="Apple-touch-startup-image" sizes="768x1004" href="Apple-touch-startup-image-768x1004.png" />
48
Donovan Woodside

<meta>タグは必要ありません。 jQuery mobileは、iOSのアドレスバーを非表示にする必要があります。ナビゲーションフッターを自分で消すことはできませんでした。

3
Jay

ロブ、以下のスクリプトを追加してみてください。これは、同じウィンドウで新しいリクエストを開くトリックを行う必要があります

<script type="text/javascript">
    window.onload = function () {
        var a = document.getElementsByTagName("a");
        for (var i = 0; i < a.length; i++) {
            if (a[i].className.match("noeffect")) {
                // Does nothing
            }
            else {
                a[i].onclick = function () {
                    window.location = this.getAttribute("href");
                    return false;
                };
            }
        }
    };
</script>
0
Saurin