MBP.hideUrlBar（）; Boilerplate Mobile

Question

我正在使用HTML Mobile Bolierplate并尝试使用以下方式隐藏URL地址栏：

<script src="/static/js/helper.js"></script>
<script>
  MBP.hideUrlBar();
</script>

但它没有用，helper.js加载好了。谁知道我哪里出错？

由于

Answer 1

在运行UI操作代码之前，等待DOM的load事件被触发总是一个好习惯。

对于新手用户： jQuery的：

jQuery(function() {
  MBP.hideUrlBar();
});

的Zepto：

Zepto(function() {
  MBP.hideUrlBar();
});

Answer 2

对于来自谷歌的人，我认为MBP.hideUrlBar（）函数需要一些关于如何使用它的解释。我花时间让它适用于Android（仅限本机浏览器，Chrome无法隐藏其地址栏）和iOS：

1. 首先，您的网页需要滚动条（这意味着您的网站不得为html,body height:100%）
2. 如果你想要你的网站是100％（这是我的情况），你需要手动计算要添加到html的高度，身体足以完全隐藏滚动条（这意味着我们需要知道高度地址栏...）

3. 如果希望MBP函数适用于load事件，请使用MBP.hideUrlBarOnLoad（）。请注意，它只适用于加载事件，而不适用于每次调整大小（方向更改）。在调整大小函数中你会有类似的东西：

   function resize(){
     firstLoadOfThePage ? MBP.hideUrlBarOnLoad() : MBP.hideUrlBar()
   }
   

   （假设firstLoadOfThePage是一个标签，知道它何时是第一次加载页面（第一次调用resize函数）

希望它会有所帮助。

Answer 3

您可以尝试：

window.scrollTo(0, 1);

隐藏地址栏。