Vue 彈出層時 禁止頁面滑動

2021-09-04 11:50:03 字數 393 閱讀 4756

上**

/***滑動限制***/

stop();

document.body.style.overflow='hidden';

document.addeventlistener("touchmove",mo,false);//禁止頁面滑動

},/***取消滑動限制***/

move();

document.body.style.overflow='';//出現滾動條

document.removeeventlistener("touchmove",mo,true);//頁面可以滑動

}

移動端彈出框時可以呼叫使用者兩個方法,如果不是vue,可以直接給html設定overflow:hinder

彈出層完美禁止頁面滾動

頁面中經常會遇到彈出層的部件,當彈出層啟用時覆蓋整個頁面,且背景部分不能滾動。實現起來有以下要點 以下是實踐 codepen 為了讓徹底禁止滾動,還可以在mousewheel和touchmove事件 分別對應pc和移動端 中呼叫preventdefault 方法 function forbidscr...

移動端蒙層底部頁面禁止滑動

蒙層 蒙層居中,且底部div禁止滑動。container style 因為不同螢幕高度不同,且字型大小不同content高度也不同,所以高度在js中控制。用 代替document.queryselector,節省重複 var function selector 彈出框 function show p...

移動端彈出層滾動時禁止body滾動

相信很多寫移動端的朋友會遇到這個問題,我也遇到了,之後就辛辛苦苦的在網上找解決辦法,下面我大概提一下我在網上看到的幾種辦法,行不行的通呢?本人就親測了下。本人學的還不是太深,如果有什麼不對的地方或者有好的解決辦法,也請告知。測試結果 chrome手機模擬器還真可以,but到了我的安卓手機上,撲街了 ...