H5页面遮罩弹框下层还能滚动的问题

在页面上显示一个遮罩层,这是非常常见的操作,在遮罩层上操作,下层也会默认跟随手指滚动

此处就是要在显示遮罩的时候禁止下层滚动。

首先设置一个全局变量

var canScroll=false;

页面初始化的时候添加事件监听

document.addEventListener('touchmove',function(e){
            if(!canScroll){
                e.preventDefault()
            }
        })

 下面只要设置canScroll这个变量就可以控制页面是否跟随手指滚动了

 

posted @ 2017-03-31 10:36  流火行者  阅读(4230)  评论(0编辑  收藏  举报