iPhone - 在页面加载时隐藏地址栏答案

【问题标题】：iPhone - Hide Address Bar on Page LoadiPhone - 在页面加载时隐藏地址栏
【发布时间】：2009-06-26 14:55:57
【问题描述】：

我有一个要加载到用户 iPhone 上的网页。加载页面时，我想隐藏顶部的状态和地址栏。我见过其他网站这样做。为了实现这一点，我在我的网页部分中放置了以下代码：

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=yes;" />
<script type="text/javascript">
  function page_Load() {
    setTimeout(function() { window.scrollTo(0, 1); }, 100);
  }
</script>

“page_Load”函数是通过页面body元素的onload事件触发的。奇怪的是，当页面加载时，状态/标题栏是隐藏的，但地址栏却不是。

如何在网页加载时同时隐藏状态/标题栏和地址栏？

谢谢！

【问题讨论】：

感谢关于“initial-scale=1.0; maximum-scale=1.0; user-scalable=yes;”的提示。我尝试了“initial-scale=1.0; user-scalable=no;”，在垂直/水平模式之间切换时会产生有线效果。

标签： javascript iphone

【解决方案1】：

对于那些使用 jQuery 的人来说，这里有一个更简单的版本：

$('body').scrollTop(1);

【讨论】：

这非常简洁——对我来说是第一次在 iPhone 和 Android 上工作，但我想我已经有了处理任何高度问题的代码。谢谢！

【解决方案2】：

想通了。事实证明我的页面需要“更长”。从绝对角度来看，尺寸是正确的，但我需要在底部添加几个像素。这会根据需要隐藏地址栏。

谢谢。

【讨论】：

嗨村民 - 我想我和你有同样的问题。你用什么来解决这个问题（如果你记得的话）

【解决方案3】：

一个快速而肮脏的 jQuery 方法...

$(function() {
    function orientationChange(e) {
        $("body").scrollTop(1);
    }
    $("body").css({ height: "+=300" }).scrollTop(1);
    $(window).bind("orientationchange", orientationChange);
});

当一个人改变他们的方向时，这也会隐藏栏（因为它确实会再次正常可见）。只需将其添加到您页面的某个位置，它就会自动（无论 100% 高度/宽度/无论如何）执行您所寻求的操作。我没有测量地址栏的确切高度，但它似乎在 70 像素左右。我把 300 放在那里只是为了确保它有效。

【讨论】：

【解决方案4】：

This page 解释了“全屏”的更多最新状态。

【讨论】：