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();
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM