rpm-mcarman b9f7ec4306 First Commit		3年前
..
examples	First Commit	3年前
node_modules/component-emitter	First Commit	3年前
.npmignore	First Commit	3年前
History.md	First Commit	3年前
Makefile	First Commit	3年前
Readme.md	First Commit	3年前
component.json	First Commit	3年前
index.js	First Commit	3年前
package.json	First Commit	3年前

Readme.md

tween

Motion tween component using ease.

Installation

$ component install component/tween

Example

var Tween = require('tween');
var raf = require('raf');
var button = document.querySelector('button');

var tween = Tween({ rotate: 0, opacity: 0 })
  .ease('out-bounce')
  .to({ rotate: 360, opacity: 1  })
  .duration(800);

tween.update(function(o){
  button.style.opacity = o.opacity;
  button.style.webkitTransform = 'rotate(' + (o.rotate | 0) + 'deg)';
});

tween.on('end', function(){
  animate = function(){};
});

function animate() {
  raf(animate);
  tween.update();
}

animate();

API

Tween(obj:Object|Array)

Initialize a new Tween with obj.

Tween#reset()

Reset the tween.

Tween#to(obj:Object|Array)

Tween to obj and reset internal state.

 tween.to({ x: 50, y: 100 })

Tween#duration(ms:Number)

Set duration to ms [500].

Tween#ease(fn:String|Function)

Set easing function to fn.

 tween.ease('in-out-sine')

Tween#update(fn:Function)

Set update function to fn or when no argument is given this performs a “step”.

Tween#stop()

Immediately stop the tween and emit “stop” and end” events. tween.stopped is then marked as true.

License

MIT