当前位置: 首页 > Web前端 > HTML

兼容移动端js弹框实现微信禁止h5禁止网页下拉滚动渗透,禁止微信内置浏览器下拉网页

时间:2023-04-02 19:28:57 HTML

//当弹出layer被触发,页面设置为100%高度,不能设置滚动。bodyhtml样式设置为"overflow":"hidden","height":'100%'//取消时,重新设置样式为原来的'overflow':'visible',"height":'100%'$('xxx').click(function(){$('弹出层').show();$('body,html').css({"overflow":"hidden","height":'100%'})})//点击遮罩层灰色区域关闭遮罩层$('遮罩层').click(function(e){e.stopPropagation();//防止冒泡默认事件$('popuplayer').hide();$('body,html').css({'overflow':'visible',"height":'100%'})})//禁止弹出框的h5页面的弹出和滚动监听touchmove事件,这样整个页面就不能滚动了,所以加个大div框判断你的解锁事件可以正常使用document.querySelector('body').addEventListener('touchmove',function(e){if(!document.querySelector('yourdivbox').contains(e.target)){e.preventDefault();}})