js开启和关闭页面滚动【亲测有效】

在移动端的页面开发过程中，经常会遇到点击弹框禁止页面滚动的情景，下面就来说下具体的做法。。。

第一步：构建一个函数

function bodyScroll(event){

  event.preventDefault();

}

第二步：点击禁止页面滚动

$(".button").click(function(){

    document.body.addEventListener('touchmove',bodyScroll,false);

    $('body').css({'position':'fixed',"width":"100%"});

});

第三步：点击开启页面滚动

$(".shadow-closes").click(function(){

    document.body.removeEventListener('touchmove',bodyScroll,false);

    $("body").css({"position":"initial","height":"auto"});

});

完整代码：

$(".button").click(function(){

    document.body.addEventListener('touchmove',bodyScroll,false);

    $('body').css({'position':'fixed',"width":"100%"});

});

$(".shadow-closes").click(function(){

    document.body.removeEventListener('touchmove',bodyScroll,false);

    $("body").css({"position":"initial","height":"auto"});

});

function bodyScroll(event){

  event.preventDefault();

}

巴特西

js开启和关闭页面滚动【亲测有效】

最新文章

热门文章