解决ios的webview中上/下拉露出黑灰色背景问题

解决ios的webview中上/下拉露出黑灰色背景问题

问题描述:手机H5页面在ios的webview中,下拉(或上拉)会露出黑灰色背景 ,感觉很不好看,现在想要去掉这个背景

解决方法:
1.touchmove时阻止系统默认的滑动事件

document.querySelector('body).addEventListener('touchmove',function(e){
	e.preventDefault();
})

这个方法在安卓上好使,但是在ios上没有作用.(注意:不要使用’touchstart’,会影响其他元素的fastclick事件)

2.下拉或者上拉时,固定定位的元素并不会随着移动,所以可以将整个bosy设置为固定定位即可.(虽然简单,但是亲测有效)

body {
    position: fixed;  /* 固定定位 */
    left: 0;
    top: 0;
}

但是这个方法适用场景是:body的高度不超过webview可视范围的高度.

猜你喜欢

转载自blog.csdn.net/bhq1711617151/article/details/82810628