移动端滚动穿透解决方案

/解决移动端滚动穿透样式/ 
body.modal { 
position: fixed; 
width: 100%; 
}

//scrollingElement兼容性代码 
(function () { 
if (document.scrollingElement) { 
return 
} 
var element = null 
function scrollingElement () { 
if (element) { 
return element 
} else if (document.body.scrollTop) { 
// speed up if scrollTop > 0 
return (element = document.body) 
} 
var iframe = document.createElement(‘iframe’) 
iframe.style.height = ‘1px’ 
document.documentElement.appendChild(iframe) 
var doc = iframe.contentWindow.document 
doc.write(‘x‘) 

doc.close() 

var isCompliant = doc.documentElement.scrollHeight > doc.body.scrollHeight 
iframe.parentNode.removeChild(iframe) 
return (element = isCompliant ? document.documentElement : document.body) 
} 
Object.defineProperty(document, ‘scrollingElement’, { 
get: scrollingElement 
}) 
})()

var Modal= (function(bodyClass) { 
var scrollTop; 
return { 
afterOpen: function() { 
scrollTop = document.scrollingElement.scrollTop; 
document.body.classList.add(bodyClass); 
document.body.style.top = -scrollTop + ‘px’; 
}, 
beforeClose: function() { 
document.body.classList.remove(bodyClass); 
document.getElementsByTagName(“body”)[0].removeAttribute(“style”); 
document.scrollingElement.scrollTop = scrollTop; 
} 
}; 
})(‘modal’)