最近在给客户做的手机版网站中用到了position:fixed 来模拟手机APP的底部的导航条,但是在三星手机的浏览器上出现了 抖动的情况,类似于下图这种情况:
在下滑的过程中,底部导航条会跟不上,在其它手机的浏览器里均没有这种情况
这种情况在IE6浏览器下也会出现。
经过查阅资料,总结出以下几种方法解决:
一.给fiexd加上如下CSS样式:
-webkit-transform: translateZ(0);
二.设置body CSS
html, body {height:100%;overflow:auto;margin: 0;}
这种方式可能会影响到页面的整体效果,不建议使用
三.在fiexd内设置position:absolute,如下:
<div style="position:fiexd;bottom:0px;">
<div style="position:absolute;">
----
</div>
</div>