在ios下如果頁面底部有fixed 元素當有input輸入框觸發鍵盤時fixed會浮動在頁面出現展示總是
解決方法有很多種，但是要根據實際需要更改
方法一、css解決（弊端：當有大面積input元素時會出現滑動不順暢問題）
//這里給內容區域設置 position:absolute，並且設置一個距離fixed的底部距離
.main{
position:absolute;
bottom:rem-calc(80px); //fixed元素的高度
top:0;
left:0;
width:100%;
}
方法二、js解決方法（弊端：每次input焦點事件時要執行一次）
.pos-rel {
position: relative;;
}
<script>
$(function() {
var isIOS = (/iphone|ipad/gi).test(navigator.appVersion);//判斷是不是ios系統
if (isIOS) {
$(‘.main’).on(‘focus’, ‘input’, function () {
$(‘.fixed-bottom’).addClass(‘pos-rel’);
}).on(‘focusout’, ‘input’, function () {
$(‘.fixed-bottom’).removeClass(‘pos-rel’);
});
}
});
</script>
當然還有其它的解決方法例如使用iscroll.js剛開始就用的這種解決方式，后來發現在input元素較多或是有click事件頁面引入iscroll.js會遇到各種坑不建議使用，當然也可以把fixed設置成absolute每次頁面滾動變化時重新計算，這種方式也非常的消耗資源
綜合以上還是覺得在帶有input元素的頁面盡量避免fixed元素的使用