滾動穿透問題

眾所周知，移動端有fixed遮罩或彈出層時，螢幕上滑動，後面的背景也會跟著滾動，強迫症的我總是覺得不舒服。然而也沒有找到完美的解決方法。

這裡說說兩種能用的方法。

1、遮罩或彈層沒有滾動的內容時：

vue裡提供了乙個很好用的解決辦法：@touchmove.prevent

如果不用vue的話，那就監聽touchmove事件，然後阻止事件的預設行為（e.preventdefault()）

2、當遮罩或彈層裡有可以滾動的內容時，上面的方法就不行了。

這時候的解決思路就是，點選彈出遮罩時，獲取下當前文件滾動條的位置，然後設定body不可滾動。關閉彈層的時候，恢復頁面可滾動並且滾動到遮罩彈出時的位置，例如。

let h = ''

//點選顯示彈窗
$(".xieyi span").click(function
() )
//body不可滑動
function
bodynotscroll() 
//點選關閉彈窗
$(".xieyitip span").click(function
())    
function
reset()

移動端滾動穿透問題

一 body。一般pc端這樣就行了，但在移動端可就不行了，因為他有touchmove。二 可以阻止彈層的touchmove事件，但如果你的彈層內的內容需要滑動，這種方法pass document.body.addeventlistener touchmove function e 三 後來找到乙個比...

滾動穿透問題完美解決方案

滾動穿透 簡單的說，滾動穿透就是彈層中有滾動時，滾動彈層滾動條背景下面內容也會滾動 目標 彈層滾動時，背景下面內容不會滾動，彈出層關閉後頁面的滾動位置仍在原處不會丟失！下面這段 直接引用，看效果 open modal one open modal two 這裡是可滾動內容 滾動 content 滾動...

解決彈出層滾動穿透的問題

乙個棘手的問題 彈出層的滾動穿透，即彈出層滾動，那麼被彈出層覆蓋的下面的內容區域也會進行滾動。彈出層我是用的view標籤然後使用的position fixed進行的定位 說一下我的解決思路 一 當彈出層裡面無滾動的時候 可以在遮罩的view標籤上定義乙個防止事件冒泡的方法 catchtouchmov...