ios webview下footer部分fixed失效問題

場景：

以下圖所示，一個很正常的頁面需求，footer固定在底部，中間爲滾動內容區

而後footer的css通常是這樣的

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

實測chrome下沒毛病，ios微信瀏覽器打開也沒毛病，可是！！！

在ios給咱們開的webview裏面，這個footer部分開始「跑」了，

具體狀況是，footer在頁面滑動的時候也跟着滑動了，等滑動完畢，

footer部分又自動「歸位」了，鎖定到了底部。是否是很詭異 ···

就IOS的webview有這毛病，

而後就摸索了一個解決方案是把整個body固定高度（屏幕高度），

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

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

上面的主內容區就overflow-y:scroll；

而後記得在這裏加上-webkit-overflow-scrolling: touch;

爲了讓你在ios上流暢滾動的。

 

避免使用fixed