ios webview下footer部分fixed失效问题

场景:css

以下图所示,一个很正常的页面需求,footer固定在底部,中间为滚动内容区ios

而后footer的css通常是这样的web

footer{
        position:fixed;
        bottom:0;
        left:0;
        width:100%;
        ``````
}

实测chrome下没毛病,ios微信浏览器打开也没毛病,可是!!!chrome

在ios给咱们开的webview里面,这个footer部分开始“跑”了,浏览器

具体状况是,footer在页面滑动的时候也跟着滑动了,等滑动完毕,微信

footer部分又自动“归位”了,锁定到了底部。是否是很诡异 ···spa

就IOS的webview有这毛病,code

而后就摸索了一个解决方案是把整个body固定高度(屏幕高度),blog

而后padding-bottom:(footer的高度)。webview

footer的css就用absolute,定在底部了。

上面的主内容区就overflow-y:scroll;

而后记得在这里加上-webkit-overflow-scrolling: touch;

为了让你在ios上流畅滚动的。

 

避免使用fixed

相关文章
相关标签/搜索