移動端fixed相容問題

最近做移動端頁面，有個需求類似下圖

底部導航用fixed定位時在部分ios版本中會有問題：

1.上滑是底部會跟著滑動，手指鬆開時才會又回到底部

2.軟鍵盤喚起的情況下，也會出現許多莫名其妙的問題

網上搜了下，ios確實對fixed相容不是很好

1

doctype html
>
2<
html 
>
3<
head
>
4<
meta 
charset
="utf-8"
>
5<
meta 
name
="viewport"
content
="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui"
>
6<
meta 
name
content
="yes"
>
7<
meta 
name
content
="black"
>810
<
style
>
11html,body
19.container
24.box
28.main1
33.main2
38.bottom
48style
>
49head
>
50<
body
>
51<
div 
class
="container"
>
52<
div 
class
="box"
>
5354
<
div 
class
="main1"
>
div>
55<
div 
class
="main2"
>
div>
56div
>
57<
div 
class
="bottom"
>
5859
<
span
>footer
span
>
60div
>
61div
>
62body
>
63html
>

移動端相容問題

1.移動端檔名不要用game等，以防被合作伺服器劫持插入廣告，從而影響專案執行 2.紅公尺手機，ua返回iphone，需要結合platform判斷，但是還不準確，導致需要ios和android區別對待的時候就坑了。3.是fixed的問題。這個解決辦法是盡量不要用，不過ios7及以下才會出現這個問題。...

移動端相容問題

2.動態獲取中間的內容高度 不同手機螢幕顯示的高度也是不一樣，滾動只滾動中間那一部分 我曾使用過css中的cale 來計算出內容中間的高度，但是最後還是發現了問題，因為移動端布局是用rem來進行適配，而cale來計算是百分比，雖然rem可以轉換成百分比，但是還是不是特別的妥當。最後我使用的是動態獲取...

移動端部分相容問題

1 h5頁面視窗自動調整到裝置寬度，並禁止使用者縮放頁面 viewport content width device width,initial scale 1.0,minimum scale 1.0,maximum scale 1.0,user scalable no 部分安卓手機的uc瀏覽器寫完...