The browser is flooding your code with events, which could make your page slow. With this library you only receive the events at 60fps, with requestAnimationFrame.
Useful events would be scroll
, resize
, touchmove
, mousemove
and mousewheel
.
FrameEvents.on(window, "scroll", yourHandler);
FrameEvents.off(window, "scroll", yourHandler);
// collect the layout properties...
function dataHandler(ev) {
return { lastScrollY: window.scrollY }
}
// ...and you will receive them as the second property in your handler
function scrollHandler(ev, data) {
console.log(data.lastScrollY)
}
FrameEvents.on(window, "scroll", scrollHandler, dataHandler);
For support of older browsers you should include a
requestAnimationFrame
polyfill.
Available on bower, named frame-events
.
- Leaner, Meaner, Faster Animations with requestAnimationFrame
- Scrolling Performance
- JankFree.org
- How (not) to trigger a layout in WebKit
- 0.0.1: removed es5 dependency and refactored
- 0.0.0: initial