@kilt/lumiere

Animation wrapper based on rAF (requestAnimationFrame)

npm

npm i @kilt/lumiere --save

yarn

yarn add lumiere

Usage

<script src="https://cdn.rawgit.com/kiltjs/lumiere/2449a6f3/dist/lumiere.min.js"></script>

import lumiere from 'lumiere';

var initial_scroll = document.scrollingElement.scrollTop,
    scroll_length = 100; // scroll down 100px

lumiere(400, function (progress) {

  document.scrollingElement.scrollTop = initial_scroll + scroll_length*progress;

}, function (progress) {

  // example of easeInQuad
  return progress*progress;

  // check out https://gist.github.com/gre/1650294 for more easing functions
  // also check out https://github.com/gre/bezier-easing

}).then(function () {

  // animation finished

});