Odo Window Events

This component keeps track of callbacks for window resize and scroll events. These callbacks are debounced and throttled, respectively. If you need higher fidelity scrolling, check out odo-scroll-animation.

Support

IE9+

Dependencies

None. Throttle and debounce packages are bundled.

Register a Callback

To listen for scroll events, register your callback with the onScroll method or the onFastScroll method. They are throttled to 500 and 150 milliseconds, respectively.

let scrolls = 0;
OdoWindowEvents.onScroll((scrollTop, scrollLeft) => {
  scrolls += 1;
  output1.innerHTML = scrolls;
});

To listen for resize events, register your callback with the onResize method or the onLeadingResize method. They are debounced to 500 milliseconds.

let resizes = 0;
OdoWindowEvents.onResize((viewportWidth, viewportHeight) => {
  resizes += 1;
  output3.innerHTML = resizes;
});

Remove a Callback

To remove a registered callback, use the remove method with the id returned from registering it.

const id = OdoWindowEvents.onFastScroll(myCallback);
OdoWindowEvents.remove(id);