之前遇到一個問題，就是寫了一個正常的移動端首頁译秦，底部是導(dǎo)航峡捡，上面的是內(nèi)容，在安卓手機(jī)是頁面滑動到底部的時候筑悴，不會再滑動的们拙，但是問題就出現(xiàn)在ios手機(jī)中。
頁面正常布局是阁吝，導(dǎo)航是position：fixed砚婆，z-index：9，其他整體布局差不多是position：relative突勇，z-index：1
（1.）滑動到底部的時候装盯，ios手機(jī)還可以再次滑動，以至于把底部的導(dǎo)航條越過去了甲馋，導(dǎo)致看不到導(dǎo)航條埂奈，影響用戶體驗(yàn)。
網(wǎng)上搜到的解決辦法有幾種
1.如果頁面是沒有滾動條的定躏，可以使用下面的js代碼
document.body.addEventListener('touchmove', function (e) {
e.preventDefault() // 阻止默認(rèn)的處理方式(阻止下拉滑動的效果)
}, { passive: false }) // passive 參數(shù)不能省略账磺，用來兼容ios和android
這幾行代碼是禁止整個頁面的滑動，所以很好理解痊远，下面看第二種
2.頁面有很多內(nèi)容垮抗，存在滾動條
那么解決辦法就是，
在頁面的最外層設(shè)置
.wrapper{
width:100%;
height:100%;
position:fixed;
z-index：1碧聪；
overflow-y:auto;
}
然后再去看ios的頁面冒版，成功阻止了這種橡皮筋效果
這里的height和width移動要設(shè)置100%；允許overflow-y:auto
成功記錄成功逞姿，這樣我媽就再也不怕我因?yàn)檫@個問題加班三小時了
