對於一般大小的彈窗可以使用如下方案：
1. 阻止預設事件
缺點：該方案存在一定的相容性，不是所有瀏覽器都有效。對於彈窗存在滾動的情況，也不適用。
優點：彈窗顯示時，頁面仍然固定在原來位置，不會回滾到頂部
//阻止彈窗滾動
function
stopscroll
() )
}function
recoverscroll
() )
}function
preventdefaultfn
(event)
缺點：在彈框彈出和隱藏時，由於頁面發生了 top 和頁面滾動，所以頁面會有閃爍的情況
優點： 可以解決彈窗本身存在滾動的情況
function
stopscrolllong
() )
settimeout(function
() )
}, 10)
}function
recoverscrolllong
() )
$(window).scrolltop(top);
}
參考：
前端 移動端彈窗彈出後禁止頁面滾動
在做專案時，我碰到了乙個問題，當浮層彈出後，浮層後面的內容仍可以滾動。首先我們要明確，當浮層彈出後，我們操作的是body的滾動條，而不是其他div。body出現滾動條。這種問題是應該避免，我認為合理的頁面布局不應該讓body出現滾動條。應該將內容放在div中，讓div出現滾動條，這樣可以很方便的處理...
移動端禁止觸控滾動
當移動端頁面顯示彈窗時，滑動螢幕，彈窗下方的頁面竟然可以上下滑動 雖然點選不到彈窗下方的內容，但仍然看不習慣 查閱資料後，給整個彈窗設定禁止觸控滾動，如下 由於頁面中存在多個彈窗，所以獲取了所有彈窗，再給每個彈窗設定禁止滾動 var masks document.getelementsbyclass...
vue滾動條禁止 vue彈窗後如何禁止滾動條滾動？
常見場景 在許多填寫表單的頁面中，都會彈出乙個選擇器，讓你在彈窗中選擇專案。有時，彈窗本身容納不下內容，需要讓它不斷滾動來展示，但因為事件是冒泡的，有時就會造成底部 body 的z index肯定是在下面的 的內容也在滾動。這內外一起滾，就有點尷尬了。舉例，下面兩張圖里，都有類似的問題。那麼怎麼解決...