在移動端的頁面開發過程中,經常會遇到點擊彈框禁止頁面滾動的情景,下面就來說下具體的做法。。。
第一步:構建一個函數
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();
}

