弹出遮罩层,禁止蒙层底部页面跟随滚动

弹出遮罩层（遮罩层必须根据浏览器视窗固定定位，poistion:fixed）

position:absolue;与poistion:fixed区别：没有滚动条的情况下没有区别

        1.position:absolue;相对元素的宽高进行定位

        2.poistion:fixed；相对于当前浏览器视窗或可视窗口的定位

        3.一般fixed用在遮盖层和固定在页面某个位置，如固定在顶端的菜单栏，又如弹出提示框居中显示

遮罩层css:{

        width:100%;

        height:100%;

        poistion:fixed;

        top:0;

        left:0;

        z-index:9999;

}

//    封装禁止页面滚动方法（该方法兼容PC端和移动端）

var top1 = 0

function stopBodyScroll (isFixed) {

        var bodyEl = document.body
        if (isFixed) {
            top1 = window.scrollY
            bodyEl.style.position = 'fixed'
            bodyEl.style.top = -top1 + 'px'
        } else {
            bodyEl.style.position = ''
            bodyEl.style.top = ''
            window.scrollTo(0, top1) // 回到原先的top
        }

}

思路：将其固定在视窗（即position: fixed），这样它就无法滚动了，当蒙层关闭时再释放。还有一些细节要考虑，将页面固定视             窗后，内容会回到最顶端，这里我们需要记录一下当前滚动条高度，弹出和释放时同步top值。