You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
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