//弹出层触发时候页面设置为高度百分百将不能滚动 设置body html的样式为”overflow”: “hidden”,”height”:’100%’
//取消时候把样式重置还原为最初’overflow’: ‘visible’,”height”:’100%’
$('xxx').click(function(){
$('弹出层').show();
$('body, html').css({
"overflow": "hidden",
"height":'100%'
})
})
//遮罩层灰色区域点击关闭遮罩层
$('遮罩层').click(function(e){
e.stopPropagation();//阻止冒泡默认事件
$('弹出层').hide();
$('body, html').css({
'overflow': 'visible',
"height":'100%'
})
})
//禁止h5页面弹出框弹出时候市面下拉滚动 监听touchmove事件,这样一来整个页面将不能滚动所以添加一个判断 你的大div盒子取消阻止事件就能正常使用了
document.querySelector('body').addEventListener('touchmove', function(e) {
if (!document.querySelector('你的div盒子').contains(e.target)){
e.preventDefault();
}
})