移动端浮层scroll时,禁止后面的网页也scroll的解决方法

浮层为position: fixed, 滑动浮层时,后面的整体网页也会滑动。为了禁止后面网页的滑动, 需要这么设置:
[安卓]
/**
  * ModalHelper helpers resolve the modal scrolling issue on mobile devices
  * https://github.com/twbs/bootstrap/issues/15852
  * requires document.scrollingElement polyfill https://github.com/yangg/scrolling-element
  */
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');

iOS设置html, body 的overflow, 浮层出现时从auto改成hidden, 消失时再改回去。 在安卓情况下会卡顿。



猜你喜欢

转载自blog.csdn.net/jdk137/article/details/80722257