position: fixed; 在 ios手機中會存在乙個失效情況：
1、針對當前內容高度小於螢幕高度時：
上下滑動頁面時候，發現之前 fixed 定位在頂部的元素會跟隨頁面滾動，變成了absolute定位的效果。
2、針對當前內容高度大於螢幕高度時：
之前 fixed 定位在頂部的 view 不見了，下滑往上翻頁面後，就會看那個fixed定位的元素錯落在頁面中，但並不是在最頂部。
綜上可以看出，ios 瀏覽器是針對 fixed 定位的元素作了處理，不再是之前定位效果，變成了 absolute 定位的效果但並不是 absolute ，但可以理解為top：對應為當前 body 的 scrolltop 值。
那麼該怎麼解決這個問題呢？
在這裡我是比較傾向於遵循 ios 瀏覽器處理 fixed 元素的初衷，瀏覽器去處理 fixed 元素應該是有它考慮的地方，退一步說其實也沒有必要在這個情況下強制顯示頂部元素，這時候使用者的重點在於輸入。
這裡給出的方案就是：在軟鍵盤彈起後，直接把 fixed 的元素變成 absolute 的，不需要瀏覽器自己去做處理，待鍵盤收起後再恢復成 fixed 。
以下**環境是在react中document.body.addeventlistener('focusin', () =>)
})document.body.addeventlistener('focusout', () =>)
})
**： h5 ios中軟鍵盤彈起後 fixed定位失效
原生H5 IOS解決監聽軟鍵盤導致樣式bug
本文主要介紹通過監聽軟鍵盤的彈起和收起，動態改變樣式。一 問題描述 當軟鍵盤彈起時，ios的fixed會變成absolute，導致樣式布局出現異常。二 關鍵 html js if os.ios document.addeventlistener focusout function 三 原理 3.1 ...
h5 移動端 監聽軟鍵盤彈起 收起
回車確認 btn on keypress function e document keyup function e 1.在ios中軟鍵盤彈起時，僅會引起 body scrolltop值改變，但是我們可以通過輸入框的獲取焦點情況來做判斷，但也只能在ios中採用這個方案，因為在android中存在主動收...
h5 移動端 監聽軟鍵盤彈起 收起
window.onresize事件來做突破點的，但是 ios 中軟鍵盤的彈起收起並不觸發 window.onresize 事件 總結 1 在 ios 中軟鍵盤彈起時，僅會引起 body scrolltop 值改變，但是我們可以通過輸入框的獲取焦點情況來做判斷，但也只能在 ios 中採用這個方案，因為...