requestAnimationFrame
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.gitignore Initial commit Oct 7, 2012
History.md 1.2.0 Sep 15, 2014
Makefile Initial commit Oct 7, 2012
Readme.md add .cancel(id) Jul 12, 2013
component.json 1.2.0 Sep 15, 2014
example.html Initial commit Oct 7, 2012
index.js Removing redundant prefixes. Sep 13, 2014
package.json 1.2.0 Sep 15, 2014

Readme.md

raf

request animation frame

Installation

$ component install component/raf

Example

Request the animation frame with raf(fn), cancel with raf.cancel(id).

var x = 0;
var y = 50;
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
var raf = require('raf');

function animate() {
  raf(animate);
  draw();
}

var prev = Date.now();
function draw() {
  var curr = Date.now();
  var diff = curr - prev;
  var p = diff / 16;
  ctx.clearRect(0, 0, 900, 300);
  ctx.beginPath();
  ctx.globalAlpha = .5;
  ctx.arc(x, y, 10, 0, Math.PI * 2, false);
  ctx.fill();
  x += 2;
  y += Math.sin(x/20) * 5;
  prev = curr;
}

animate();

License

MIT