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);