web-dev-qa-db-ja.com

モバイルブラウザのアドレスバーを非表示にする方法

SafariとモバイルデバイスのChromeの両方には、ページの読み込み時に表示されるアドレスバーが含まれています。ページのbodyがスクロールすると、これらのブラウザーはアドレスバーを画面外にスクロールして、次の画像に示すようにWebサイトにより多くのスペースを提供します。

Note the missing Address bar in the right image

私のサイトでこれを許可しているときに少し問題が発生しています。私はすべてのポケモンの非常に長いリストを含むポケデックスに取り組んでいます。ただし、ページの設定方法では、アドレスバーをスクロールして見たくはありません。

Note that by scrolling the address bar is still visible

私のhtmlは次のようになります：

<body>
  <app> <!-- My Angular2 tag for the app, no special styles for this -->
    <nav>...</nav> <!-- The red nav bar and hamburger menu, default bootstrap -->
    <div class="fluid-container">...</div> <!-- The container for all pokemon entries -->
  </app>
</body>

リストの一番下（721エントリ）までスクロールすると、それ以上スクロールすると、アドレスバーが画面上部から移動します。ナビゲーションバーをタッチして上方向にドラッグすると、アドレスバーが画面外に移動します。これらの両方は、これを行うには直感的でない方法のようです。

私はそれを隠すJavaScriptを使用してページの本文をスクロールする方法があると思いますが、 これまで試したもの は機能しません。私がそれをしたとき、目に見えるスクロールは起こりませんでした。

ページが読み込まれた直後にモバイルブラウザのアドレスバーを非表示にするためにページをスクロールするにはどうすればよいですか？

編集：これを詳しく調べるほど、ユーザーの操作なしでは不可能に思えます。ユーザーの操作が必要な場合、画面の中央でユーザーがタッチすると、最初に本文をスクロールしてから、divのすべてのエントリをスクロールしようとすることはできますか？これが私が考えている方法で機能する場合、リストをスライドする前に、まずアドレスバーを邪魔にならないようにスライドさせます。これは、デフォルトのブラウザの動作の逆のようなものなので、不可能/簡単/信頼できない可能性がありますが、誰かがアイデアを持っているかどうか試してみようと思います。

javascriptmobile-browseraddress-bar
26
Corey Ogburn

これは古いことは知っていますが、ここに追加する必要があります。

そして、これは完全な答えではありませんが、「IN ADDITION TO」です

Httpsを使用していない場合、アドレスバーは消えません。

また

Httpsを使用しているにもかかわらずアドレスバーが非表示にならない場合は、Webページでhttpsエラーが発生している可能性があります（https以外の場所から提供されている特定の画像など）。

お役に立てれば..

13
Tony

このHTML5 rocksの投稿をご覧ください- http://www.html5rocks.com/en/mobile/fullscreen/ 基本的にはJSを使用できます、またはフルスクリーンAPI（より良いオプションIMO）またはページにWebアプリであることを示すためにいくつかのメタデータをヘッドに追加します

8
Ant Kennedy

これは、アドレスバーを非表示にするために必要なコードである必要があります。

window.addEventListener("load",function() {
    setTimeout(function(){
        // This hides the address bar:
        window.scrollTo(0, 1);
    }, 0);
});

ちなみに、見栄えの良いポケデックス！お役に立てれば！

4
NiallMitch14

ページのスクロールを隠すブラウザのアドレスバーをアーカイブする最も簡単な方法は、"display": "standalone",をmanifest.jsonファイルに追加することです。

3
Mārcis P