GithubHelp home page GithubHelp logo

talarcon / raf Goto Github PK

View Code? Open in Web Editor NEW

This project forked from o2web/raf

0.0 2.0 0.0 597 KB

requestAnimationFrame handler

License: GNU General Public License v2.0

CSS 44.18% JavaScript 48.07% HTML 7.75%

raf's Introduction

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

raf's People

Contributors

benediktvaldez avatar ctibo avatar louim avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.