如何隱藏Chrome for Android平板電腦中的工具欄，以獲得100％的高分辨率網站

Question

我正在嘗試制作一個100％的屏幕寬度和100％的屏幕高度，寬高比為16：9的Web應用程序。 如果我能在平板電腦上全屏查看這個網站會很棒，但不幸的是屏幕工具欄會占用大量空間，使我的網站既不顯示全高也不顯示全寬：

現在我知道，從最近開始，可以通過向下滾動頁面來隱藏滾動條（ 源代碼 ）。 但是，由於我的Web應用程序是100％高，我無法以這種方式隱藏工具欄。

我想知道是否有人對我如何能夠隱藏工具欄有另一個想法。 我只選擇一個CSS（或者可能是某些我不知道的HTML元標記）方法，但我也會選擇使用JavaScript的技術。

Answer 1

最后，我通過添加滾動到我的文檔的可能性來解決問題。 我將body元素定位為固定，這樣我現在可以通過向上滑動隱藏工具欄但不移動任何內容。 我承認這有點像黑客。

html {
    padding-bottom: 1000px;
}

body {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

Answer 2

這是一個可以解決您的問題的JS選項。 https://github.com/scottjehl/Hide-Address-Bar/blob/master/hide-address-bar.js