关于页面出现弹窗时,页面还可以滚动问题
1、当我们的布局中是采用body为容器的页面滚动时,当出现在弹窗的时候,虽然给弹窗和遮罩加上固定布局fixed,但是在移动端中,页面还是会跟着滚动,无法滚动布局。
解决方案一:我们可以进行如下设置,注意,此时body的宽度需要设置为100%,不然会出错!
// 防止关闭弹窗以后 body回到dingbu var Fixedtop, isLock = false; //锁屏状态 function ifFixed(fixedFlag) { if(fixedFlag){ Fixedtop = window.scrollY document.body.style.position = 'fixed' document.body.style.top = -Fixedtop + 'px' isLock = true; }else{ document.body.style.position = 'initial' document.body.style.top = 0 window.scrollTo(0, Fixedtop) isLock = false; } }
解决方案二:改用content布局滚动,而不用body滚动
具体见移动端中遇到的坑(bug)一篇