diff --git a/Readme.md b/Readme.md
index 13ce8dd..f29c7a5 100644
--- a/Readme.md
+++ b/Readme.md
@@ -17,6 +17,7 @@ var button = document.querySelector('button');
var tween = Tween({ rotate: 0, opacity: 0 })
.ease('out-bounce')
.to({ rotate: 360, opacity: 1 })
+ .delay(200)
.duration(800);
tween.update(function(o){
@@ -56,6 +57,10 @@ animate();
Set duration to `ms` [500].
+### Tween#delay(ms:Number)
+
+ Set delay to `ms` [0].
+
### Tween#ease(fn:String|Function)
Set easing function to `fn`.
diff --git a/examples/array.html b/examples/array.html
index e304f6e..c0ff6e1 100644
--- a/examples/array.html
+++ b/examples/array.html
@@ -45,4 +45,4 @@
}
animate();
-
\ No newline at end of file
+
diff --git a/examples/circle.html b/examples/circle.html
index 64e50e5..e563437 100644
--- a/examples/circle.html
+++ b/examples/circle.html
@@ -20,7 +20,8 @@
var tween = Tween({ alpha: 0, border: 1, radius: 1 })
.ease('out-bounce')
.to({ alpha: 1, border: 15, radius: 150 })
- .duration(1000);
+ .duration(1000)
+ .delay(1000)
tween.update(function(o){
canvas.width = canvas.width;
diff --git a/examples/delay.html b/examples/delay.html
new file mode 100644
index 0000000..79b71b5
--- /dev/null
+++ b/examples/delay.html
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
diff --git a/index.js b/index.js
index e087722..1d7dcaf 100644
--- a/index.js
+++ b/index.js
@@ -24,6 +24,7 @@ function Tween(obj) {
this._from = obj;
this.ease('linear');
this.duration(500);
+ this.delay(0);
}
/**
@@ -75,6 +76,19 @@ Tween.prototype.duration = function(ms){
return this;
};
+/**
+ * Set delay to `ms` [0].
+ *
+ * @param {Number} ms
+ * @return {Tween} self
+ * @api public
+ */
+
+Tween.prototype.delay = function(ms){
+ this._delay = ms;
+ return this;
+};
+
/**
* Set easing function to `fn`.
*
@@ -121,7 +135,10 @@ Tween.prototype.step = function(){
var duration = this._duration;
var now = Date.now();
var delta = now - this._start;
- var done = delta >= duration;
+ var done = delta >= duration + this._delay;
+ var waiting = delta < this._delay;
+
+ if (waiting) return;
// complete
if (done) {
@@ -137,7 +154,7 @@ Tween.prototype.step = function(){
var to = this._to;
var curr = this._curr;
var fn = this._ease;
- var p = (now - this._start) / duration;
+ var p = (now - this._start - this._delay) / duration;
var n = fn(p);
// array