将id为head的div固定在最顶部,所设置的CSS属性如下:
#head { overflow:hidden; *zoom:1; height:44px; background-image:url(../Img/bg.png); position:fixed; z-index:500; width:100%; }
在自己手机上打开页面,向下滑动时这个div会出现短暂的向下瞬间移动之后马上跳回到最顶部,网上资料表明是position:fixed不兼容某些浏览器的缘故,解决方法有多种:
1.给这个设置了position:fixed的元素再设置一个CSS属性:-webkit-transform: translateZ(0);
2.给html, body元素设置CSS属性 {height:100%;overflow:auto;margin: 0;}
3.引入jquery1.7.2的类库,<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
4.在fiexd内设置position:absolute,如:
<div style="position:fiexd;bottom:0px;">
<div style="position:absolute;">
</div>
</div>
参考资料: