如何使地址栏在移动浏览器上始终可见？

Question

如何让地址栏在移动浏览器上始终可见？

我尝试了许多解决方案，例如获取正文高度并将其作为 CSS 添加到 HTML 和正文中，如下所示：

$("html, body").css({
   height: $(window).height()
});

我也尝试过这样的事情：

window.scrollTo(0, 1);

但没有任何改变。

Answer 1

stackoverflow 上的其他解决方案（例如this one）谈论防止body 滚动。您正在设置身体高度，这很好，但身体仍然有一个滚动条。试试：

• 将body overflow 设置为隐藏。
• 添加一个新的div，即height: 100%；和overflow: auto。将整个页面放在这个 div 中。 div 将具有滚动条而不是正文。 （仔细阅读链接的解决方案）。

现在，我不鼓励这样做的原因：

1. 如果您破坏了他们习惯的工作流程，用户会讨厌您。这几乎是永远正确的做法。
2. 滚动正文总是比滚动 div 快很多。如果页面非常大，您会看到非常明显的性能下降。

更新：地址栏正在移动

Android 上的 Chrome 正在尝试将地址栏向下移动到屏幕底部，以便更方便单手使用。这是一个很好的例子，说明为什么网页应该永远尝试添加黑客来解决浏览器行为。