zoukankan      html  css  js  c++  java
  • 弹窗滚动,禁止底部滚动

    解决方案 position: fixed

    body.modal-open {
    position: fixed;
    100%;
    }

    如果只是上面的 css,滚动条的位置同样会丢失
    所以如果需要保持滚动条的位置需要用 js 保存滚动条位置关闭的时候还原滚动位置

    var ModalHelper = (function(bodyCls) {
    var scrollTop;
    return {
    afterOpen: function() {
    scrollTop = document.scrollingElement.scrollTop;
    document.body.classList.add(bodyCls);
    document.body.style.top = -scrollTop + 'px';
    },
    beforeClose: function() {
    document.body.classList.remove(bodyCls);
    // scrollTop lost after set position:fixed, restore it back.
    document.scrollingElement.scrollTop = scrollTop;
    }
    };
    })('modal-open');
     
    弹窗出现后,记住当前页面滚动距离,关闭弹窗时,将页面滚动到之前记录的滚动距离
  • 相关阅读:
    Sword 17
    Sword 16
    Sword 15
    Sword 14-II
    Sword 14-I
    Sword 13
    Sword 11
    Sword 10-II
    Sword 10
    【python+selenium】三种等待方式
  • 原文地址:https://www.cnblogs.com/itliulei/p/10297653.html
Copyright © 2011-2022 走看看