qanimationframe

Promisified requestAnimationFrame with Q

Usage no npm install needed!

<script type="module">
  import qanimationframe from 'https://cdn.skypack.dev/qanimationframe';
</script>

README

DEPRECATED in favor of raf.

QanimationFrame

A simple Promise wrapper for requestAnimationFrame based on Q.

This library intends to promisify requestAnimationFrame.

Checkout the Annotated Source Code

Usage

QanimationFrame is a function which takes a function and returns a promise containing it's return value (after one frame).

QanimationFrame(f: function) => DOM.Element

Basic example

var elt = document.createElement("div");
elt.innerHTML = "Hello world";
window.document.body.appendChild(elt);

var doSomething = QanimationFrame(function () {
  elt.style.width = '50px';
  elt.style.height = '50px';
  return elt;
});

doSomething.then(function (elt) {
  // style changes are rendered
  var boundingBox = elt.getBoundingClientRect(elt);
  console.log(boundingBox.right - boundingBox.left);
});

Installation

via npm.

npm install qanimationframe

via bower

bower install qanimationframe

Supported browsers

All browsers are supported (including IE).

Tests

SauceLabs Status