直播平臺製作，禁止頁面滾動 / 滾動事件穿透

直播平臺製作，禁止頁面滾動 / 滾動事件穿透

移動端解決方案

在蒙層所在div上加 @touchmove.prevent

<div class="maskBox" @touchmove.prevent></div>

PC端解決方案

彈層顯示時呼叫 stopMove()停止頁面滾動 ，彈層消失時呼叫 Move()開啟頁面滾動

//停止頁面滾動
stopMove(){
  let m = function(e){e.preventDefault();};
  document.body.style.overflow='hidden';
  document.addEventListener("touchmove",m,{ passive:false });//禁止頁面滑動
},
//開啟頁面滾動
Move(){
  let m =function(e){e.preventDefault();};
  document.body.style.overflow='';//出現捲軸
  document.removeEventListener("touchmove",m,{ passive:true });
}

 以上就是直播平臺製作，禁止頁面滾動 / 滾動事件穿透， 更多內容歡迎關注之後的文章