解決移動端遮罩層無法覆蓋全部頁面問題

 

今天在做移動端項目的時候遇到遮罩層效果，按照以往的PC端我直接給同級遮罩層100%  給完之后測試看似完美但。。。

　　　　　　　　　　　　　　　　這就尷尬了。。。。

之后查閱了相關資料得知這里有個方法可以解決這個問題那就是“禁止全局滾動”

　里面用的touch事件可參考 HTML5移動端觸摸事件

document.addEventListaner('touchmove',stopTouchMove,false);
//當手在屏幕上移動的時候執行stopTouchMove函數(阻止默認事件)
//這個可以用在當遮罩層彈出的話執行

document.removeEventListener('touchmove',stopTouchMove,false);
//移除touchmove事件
//這個在關閉遮罩層時候執行

function stopTouchMove( e ) {
           e.preventDefault();
     }
//阻止默認事件函數

 

看看我是如何解決的。

這樣就完美解決了遮罩層無法覆蓋全部頁面的問題！