raf.js

RequestAnimationFrame handler is made to increase performance of events fired by the window element

Supports AMD / CommonJS loaders

Data

All raf.js data you might need is stored in a global variable named raf.

window.raf = {

    request: 0			// current raf request
    events: [], 		// list of events hooked to raf
    eventsCount: 0, 	// current count of events

    pointer: {},		// pointer position, updated if pointermove event is hooked
    scroll: {},			// scroll position, updated if scroll event is hooked

    on: function(), 	// start raf loop
    off: function(), 	// stop raf loop, useful for debugging
    loop: function(), 	// request another frame
    updateDataSources(), // update dom/prefix combos used for resize detections

    detects: {},		// Events available for detection
    inits: {}, 			// Available init callbacks when first occurence of event is hooked
    kills: {}, 			// Available kill callbacks when last occurence of event is unhooked

    win: {}, 			// Data used for window calculations
    doc: {}, 			// Data used for window calculations

}

Available events

• scroll
• pointermove
• windowresize
• documentresize
• afterwindowresize
• afterdocumentresize
• nextframe
• eachframe

Hooking your callback onto an event

window.raf.on('scroll', myScrollCallback);
window.raf.on('documentresize', myResizeCallback);
window.raf.on('afterdocumentresize', myHeavyResizeCallback);

Removing your callback from an event

window.raf.off('scroll', myCallback);