x
首页 前端[Html/Css] web应用(Android,iPhone,iPad) 隐藏地址栏(全屏)

web应用(Android,iPhone,iPad) 隐藏地址栏(全屏)

发表于 2012-06-13 - 浏览:17106 评论:1 收藏 0

 

主要是利用window.scrollTo(0, 0);方法,控制网页往上滚动地址栏的高度,以达到隐藏地址栏的效果

 

要注意的几个点:这个方法要在内容加载完成后执行,换句话浏览器内容的高度要超过浏览器窗口高度(出现'滚动条')才有效。

针对这个高度自适应的窗口(height:100%),得用特殊方式解决:

  1. //强制让内容超过  
  2. $('#main').css("height",window.innerHeight+100);  
  3. window.scrollTo(0, 1);  
  4. //重置成新高度  
  5. $("#main").css("height",window.innerHeight);  
  6. //非常重要,用于兼容不同机型,防止浏览器窗口移动  
  7. document.addEventListener('touchmove'function (e) { e.preventDefault(); }, false);  

另外,最后一行,用于阻止手动滚动页面

 

 

 

 

文章评论。。。