阻止鼠标滚动穿透事件

在弹窗内滚动鼠标会触发页面的滚动条滚动，这就是鼠标滚动穿透事件

1.js解决

  var eventType ='wheel';
//兼容火狐浏览器
  if(document.mozHidden !==undefined){
      eventType = 'DOMMouseScroll';
}
//test为弹窗的id
  $('#test').on(eventType, function(e){
        var scrollTop = this.scrollTop,
            scrollHeight = this.scrollHeight,
            height = this.clientHeight;
        var wheelDelta = (e.originalEvent.wheelDetal)? (e.originalEvent.wheelDetal): -(e.originalEvent.detail || 0);
      if((wheelDetal >0 && scrollTop <= wheelDetal) || (wheelDetal < 0 && scrollHeight - height - scrollTop <= -1 * wheelDetal)){
         // IE浏览器下滚动会跨越边界直接影响父级滚动，因此，临界时候手动边界滚动定位
        this.scrollTop = wheelDetal > 0 ? 0 : scrollHeight;
        e.preventDefault();
}
})；

2，窗口加载完成时，给body元素添加一个类.scrollHidden{overflow:hidden;height:100%},

  关闭弹窗时，移除.scrollHidden类

这种方法会有个缺点，关闭弹窗时若页面有滚动条，页面会动一下，因为页面宽度不包括滚动条的宽度