6. 隐藏工具栏
你可能已经注意到在iPhone上第一次载入某个页面时,URL工具栏是可见的,但往下滚动页面时,ULR工具栏就消失了。
图 5 有URL工具栏
如果你想让你的Web应用程序看起来更象一个本地iPhone应用程序,可能会想到在页面载入时移除掉工具栏,实现起来其实很简单,只需要使页面向下滚动1个像素即可,如:
window.addEventListener('load', function(){
setTimeout(scrollTo, 0, 0, 1);
}, false);
setTimeout(scrollTo, 0, 0, 1);
}, false);
例子9(链接:http://www.sitepoint.com/examples/iphone-development-12tips/hide-toolbars.html)显示了这个行为。使用iPhone浏览这个地址的效果如下图所示。
图 6 无ULR工具栏
如果你也的页面太短不能滚动怎么办?这个时候我们需要添加一个额外的meta元素,以便让页面可以滚动,使用meta元素设置可视区的高度:
<meta name="viewport" content="height=device-height,width=device-width" />