监听和移除鼠标滚动兼容写法

// creates a global "addWheelListener" method
// example: addWheelListener( elem, function( e ) { console.log( e.deltaY ); e.preventDefault(); } );
(function(window, document) {
  var prefix = '';
  var _addEventListener;
  var _removeEventListener;
  // var onwheel;
  var support;

  // detect event model
  if (window.addEventListener) {
    _addEventListener = 'addEventListener';
    _removeEventListener = 'removeEventListener';
  } else {
    _addEventListener = 'attachEvent';
    _removeEventListener = 'detachEvent';
    prefix = 'on';
  }

  // detect available wheel event
  support = 'onwheel' in document.createElement('div') ? 'wheel' // 各个厂商的高版本浏览器都支持"wheel"
    : document.onmousewheel !== undefined ? 'mousewheel' // Webkit 和 IE一定支持"mousewheel"
      : 'DOMMouseScroll'; // 低版本firefox

  window.removeWheelListener = function(elem, callback) {
    _removeWheelListener(elem, callback);

    // handle MozMousePixelScroll in older Firefox
    if (support === 'DOMMouseScroll') {
      _removeWheelListener(elem, 'MozMousePixelScroll', callback);
    }
  };

  window.addWheelListener = function(elem, callback, useCapture) {
    _addWheelListener(elem, support, callback, useCapture);

    // handle MozMousePixelScroll in older Firefox
    if (support === 'DOMMouseScroll') {
      _addWheelListener(elem, 'MozMousePixelScroll', callback, useCapture);
    }
  };

  function _removeWheelListener(elem, eventName, callback) {
    elem[ _removeEventListener ](prefix + eventName, callback);
  }

  function _addWheelListener(elem, eventName, callback, useCapture) {
    callback = support === 'wheel' ? callback : function(originalEvent) {
      !originalEvent && (originalEvent = window.event);

      // create a normalized event object
      var event = {
        // keep a ref to the original event object
        originalEvent: originalEvent,
        target: originalEvent.target || originalEvent.srcElement,
        type: 'wheel',
        deltaMode: originalEvent.type === 'MozMousePixelScroll' ? 0 : 1,
        deltaX: 0,
        deltaZ: 0,
        preventDefault: function() {
          originalEvent.preventDefault
            ? originalEvent.preventDefault()
            : originalEvent.returnValue = false;
        }
      };

      // calculate deltaY (and deltaX) according to the event
      if (support === 'mousewheel') {
        event.deltaY = -1 / 40 * originalEvent.wheelDelta;
        // Webkit also support wheelDeltaX
        originalEvent.wheelDeltaX && (event.deltaX = -1 / 40 * originalEvent.wheelDeltaX);
      } else {
        event.deltaY = originalEvent.detail;
      }

      // it's time to fire the callback
      return callback(event);
    };

    elem[ _addEventListener ](prefix + eventName, callback, useCapture || false);
  }
})(window, document);

参考 MDN scroll