如何隐藏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