Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Newer
Older
100644 78 lines (48 sloc) 1.307 kb
75c73755 » visionmedia
2012-10-28 Initial commit
1
2 # tween
3
ec189ece » visionmedia
2012-10-28 link to ease
4 Motion tween component using [ease](https://github.com/component/ease).
75c73755 » visionmedia
2012-10-28 Initial commit
5
6 ## Installation
7
8 $ component install component/tween
9
c7a4d2ec » visionmedia
2012-10-28 docs
10 ## Example
11
12 ```js
13 var Tween = require('tween');
14 var raf = require('raf');
15 var button = document.querySelector('button');
16
17 var tween = Tween({ rotate: 0, opacity: 0 })
18 .ease('out-bounce')
19 .to({ rotate: 360, opacity: 1 })
20 .duration(800);
21
22 tween.update(function(o){
23 button.style.opacity = o.opacity;
24 button.style.webkitTransform = 'rotate(' + (o.rotate | 0) + 'deg)';
25 });
26
27 tween.on('end', function(){
28 animate = function(){};
29 });
30
31 function animate() {
32 raf(animate);
33 tween.update();
34 }
35
36 animate();
37 ```
38
75c73755 » visionmedia
2012-10-28 Initial commit
39 ## API
40
4e08166b » visionmedia
2012-11-10 add array tweening support
41 ### Tween(obj:Object|Array)
3cfe4bc7 » visionmedia
2012-10-28 docs
42
43 Initialize a new `Tween` with `obj`.
44
45 ### Tween#reset()
46
47 Reset the tween.
48
4e08166b » visionmedia
2012-11-10 add array tweening support
49 ### Tween#to(obj:Object|Array)
3cfe4bc7 » visionmedia
2012-10-28 docs
50
51 Tween to `obj` and reset internal state.
edec4aac » visionmedia
2013-05-29 docs
52
3cfe4bc7 » visionmedia
2012-10-28 docs
53 tween.to({ x: 50, y: 100 })
54
55 ### Tween#duration(ms:Number)
56
57 Set duration to `ms` [500].
58
59 ### Tween#ease(fn:String|Function)
60
61 Set easing function to `fn`.
edec4aac » visionmedia
2013-05-29 docs
62
3cfe4bc7 » visionmedia
2012-10-28 docs
63 tween.ease('in-out-sine')
64
65 ### Tween#update(fn:Function)
66
edec4aac » visionmedia
2013-05-29 docs
67 Set update function to `fn` or
3cfe4bc7 » visionmedia
2012-10-28 docs
68 when no argument is given this performs
69 a "step".
75c73755 » visionmedia
2012-10-28 Initial commit
70
edec4aac » visionmedia
2013-05-29 docs
71 ### Tween#stop()
72
73 Immediately stop the tween and emit "stop" and end" events. `tween.stopped`
74 is then marked as `true`.
75
75c73755 » visionmedia
2012-10-28 Initial commit
76 ## License
77
78 MIT
Something went wrong with that request. Please try again.