弹窗滚动穿透

PC 端: 可直接给body加overflow: hidden；

手机端：上述方法不行，因为弹层关闭后页面滚动条会丢失。

若弹窗内没有需要滚动的内容：

modal.addEventListener('touchmove', function(e) {
  e.preventDefault();
}, false);

若有：

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

同时用js手动给body设置top

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;
      //这里我觉得用window.scrollTo(0, x)为好！
    }
  };
})('modal-open');

---ps 以上用document.scrollingElement.scrollTop来记录滚动条高度

另document.documentElement.scrollTop === window.scrollY 要比上述值略大8px //为啥捏？

对！其实标准应该用window.scrollY拉！对应于IE的window.pageYOffset.

所以正确的获取滚动条高度的写法应为：

window.scrollY || window.pageYOffset

另 因为不同浏览器定义scroll的el不同，chrome和Safari是以body为基准，而ff是以html即document.documentElement为基准

//虽然我担心这种方法会引起文档的重绘 是不是不大好呀

---ps

垂直居中还有display: table-cell; vertical-align: middle这样子的万能搭