Question

我正在一个移动网站上工作，该网站的“页面”有div，它占据屏幕的全尺寸，你可以在每个页面之间滚动。问题是，只要用户向下滚动，窗口就会调整大小，因为地址栏会隐藏。当您滚动到完整的底部并且地址栏然后隐藏时，这会导致问题。

是否可以让地址栏始终显示在移动设备上？

Answer 1

您可以使用div打包HTML并执行以下操作：http://jsfiddle.net/DerekL/Fhe2x/show

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

适用于Android和iOS。

Answer 2

你在看iPhone吗？我不知道Android，但在iOS 7 for iPhone上它是不可能的。您可以做的一件事是使用minimal-ui来创建一个始终最小化的导航栏，保持窗口的大小一致：

<meta name="viewport" content="width=device-width, minimal-ui">

http://visuellegedanken.de/2014-03-13/viewport-meta-tag-minimal-ui/

我希望有所帮助！

Answer 3

实现此目的的最简单方法是滚动容器，而不是滚动文档。

E.g：

<html><body>
  <div id="scrollable-content"> ... all your content here ... </div>
</body></html>

html, body {
  height: 100%;
}

#scrollable-content {
  height: 100%;
  overflow-y: scroll;
}

禁用在移动设备上隐藏地址栏

3 个答案: