如何在一个100%高的网站上隐藏Android平板电脑的Chrome工具栏

Question

我试图制作一个100%屏幕宽度和100%屏幕高度的网络应用程序，16:9宽高比。如果我能在平板电脑上全屏查看这个网站，那就太棒了，但不幸的是，屏幕上的工具栏占用了大量空间，使得我的网站既不能全高也不能全宽显示：

现在我知道，从最近开始，可以通过向下滚动页面来隐藏滚动条（源代码）。然而，由于我的web应用程序是100%高，我无法以这种方式隐藏工具栏。

我想知道是否有人对我如何隐藏工具栏另有想法。首选只使用CSS（或者一些我不知道的HTML元标记）的方法，但我也会选择使用JavaScript的技术。

Answer 1

这里有一个JS选项可以解决您的问题。https://github.com/scottjehl/Hide-Address-Bar/blob/master/hide-address-bar.js

Answer 2

最后，我通过添加滚动到文档的可能性解决了这个问题。我定位了body元素fixed，这样我现在可以通过向上滑动而不移动任何内容来隐藏工具栏。我承认这有点像黑客。

html {
    padding-bottom: 1000px;
}

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