maranomynet / wheelcapture

Tiny utility to avoid capturing (cancelling) wheel-events when users are using their mouse-wheel to scroll the page.

WheelCapture

Tiny utility to avoid capturing (cancelling) wheel-events when users are using their mouse-wheel to scroll the page. (Think of annoying accidental map-zooms during page-scroll etc.)

WheelCapture.isOkFor( capturingElm ); returns true if the current burst (or sequence) of wheel-events started on capturingElm or an element within capturingElm.

Install and Inclusion

npm install wheelcapture

WheelCapture is CommonJS (require()) friendly, using module.exports by default -- setting window.WheelCapture only as last resort.

Configuration

You can control how many milliseconds must elapse for wheel-events to be considered separate/unconnected events.

var WheelCapture = require('wheelcapture');

WheelCapture.settings.delay = 400; // 400ms is the default

Usage

React example:

componentDidMount: function () {
    WheelCapture.on();
  },

componentWillUnmount: function () {
    WheelCapture.off();
  },

handleOnWheel: function (e) {
    if ( WheelCapture.isOkFor(e.currentTarget) ) {
      e.preventDefault();
      doTimelineShift();
    }
  },