-
-
Save sousk/310750 to your computer and use it in GitHub Desktop.
animation demo script with jsdeffered described at http://subtech.g.hatena.ne.jp/cho45/20100221/1266758781
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/ | |
* | |
* Uses the built in easing capabilities added In jQuery 1.1 | |
* to offer multiple easing options | |
* | |
* TERMS OF USE - jQuery Easing | |
* | |
* Open source under the BSD License. | |
* | |
* Copyright © 2008 George McGinley Smith | |
* All rights reserved. | |
* | |
* Redistribution and use in source and binary forms, with or without modification, | |
* are permitted provided that the following conditions are met: | |
* | |
* Redistributions of source code must retain the above copyright notice, this list of | |
* conditions and the following disclaimer. | |
* Redistributions in binary form must reproduce the above copyright notice, this list | |
* of conditions and the following disclaimer in the documentation and/or other materials | |
* provided with the distribution. | |
* | |
* Neither the name of the author nor the names of contributors may be used to endorse | |
* or promote products derived from this software without specific prior written permission. | |
* | |
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY | |
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF | |
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE | |
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, | |
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE | |
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED | |
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING | |
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED | |
* OF THE POSSIBILITY OF SUCH DAMAGE. | |
* | |
*/ | |
// t: current time, b: begInnIng value, c: change In value, d: duration | |
jQuery.easing['jswing'] = jQuery.easing['swing']; | |
jQuery.extend( jQuery.easing, | |
{ | |
def: 'easeOutQuad', | |
swing: function (x, t, b, c, d) { | |
//alert(jQuery.easing.default); | |
return jQuery.easing[jQuery.easing.def](x, t, b, c, d); | |
}, | |
easeInQuad: function (x, t, b, c, d) { | |
return c*(t/=d)*t + b; | |
}, | |
easeOutQuad: function (x, t, b, c, d) { | |
return -c *(t/=d)*(t-2) + b; | |
}, | |
easeInOutQuad: function (x, t, b, c, d) { | |
if ((t/=d/2) < 1) return c/2*t*t + b; | |
return -c/2 * ((--t)*(t-2) - 1) + b; | |
}, | |
easeInCubic: function (x, t, b, c, d) { | |
return c*(t/=d)*t*t + b; | |
}, | |
easeOutCubic: function (x, t, b, c, d) { | |
return c*((t=t/d-1)*t*t + 1) + b; | |
}, | |
easeInOutCubic: function (x, t, b, c, d) { | |
if ((t/=d/2) < 1) return c/2*t*t*t + b; | |
return c/2*((t-=2)*t*t + 2) + b; | |
}, | |
easeInQuart: function (x, t, b, c, d) { | |
return c*(t/=d)*t*t*t + b; | |
}, | |
easeOutQuart: function (x, t, b, c, d) { | |
return -c * ((t=t/d-1)*t*t*t - 1) + b; | |
}, | |
easeInOutQuart: function (x, t, b, c, d) { | |
if ((t/=d/2) < 1) return c/2*t*t*t*t + b; | |
return -c/2 * ((t-=2)*t*t*t - 2) + b; | |
}, | |
easeInQuint: function (x, t, b, c, d) { | |
return c*(t/=d)*t*t*t*t + b; | |
}, | |
easeOutQuint: function (x, t, b, c, d) { | |
return c*((t=t/d-1)*t*t*t*t + 1) + b; | |
}, | |
easeInOutQuint: function (x, t, b, c, d) { | |
if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b; | |
return c/2*((t-=2)*t*t*t*t + 2) + b; | |
}, | |
easeInSine: function (x, t, b, c, d) { | |
return -c * Math.cos(t/d * (Math.PI/2)) + c + b; | |
}, | |
easeOutSine: function (x, t, b, c, d) { | |
return c * Math.sin(t/d * (Math.PI/2)) + b; | |
}, | |
easeInOutSine: function (x, t, b, c, d) { | |
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b; | |
}, | |
easeInExpo: function (x, t, b, c, d) { | |
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; | |
}, | |
easeOutExpo: function (x, t, b, c, d) { | |
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; | |
}, | |
easeInOutExpo: function (x, t, b, c, d) { | |
if (t==0) return b; | |
if (t==d) return b+c; | |
if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; | |
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; | |
}, | |
easeInCirc: function (x, t, b, c, d) { | |
return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b; | |
}, | |
easeOutCirc: function (x, t, b, c, d) { | |
return c * Math.sqrt(1 - (t=t/d-1)*t) + b; | |
}, | |
easeInOutCirc: function (x, t, b, c, d) { | |
if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b; | |
return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b; | |
}, | |
easeInElastic: function (x, t, b, c, d) { | |
var s=1.70158;var p=0;var a=c; | |
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; | |
if (a < Math.abs(c)) { a=c; var s=p/4; } | |
else var s = p/(2*Math.PI) * Math.asin (c/a); | |
return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; | |
}, | |
easeOutElastic: function (x, t, b, c, d) { | |
var s=1.70158;var p=0;var a=c; | |
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; | |
if (a < Math.abs(c)) { a=c; var s=p/4; } | |
else var s = p/(2*Math.PI) * Math.asin (c/a); | |
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b; | |
}, | |
easeInOutElastic: function (x, t, b, c, d) { | |
var s=1.70158;var p=0;var a=c; | |
if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5); | |
if (a < Math.abs(c)) { a=c; var s=p/4; } | |
else var s = p/(2*Math.PI) * Math.asin (c/a); | |
if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; | |
return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b; | |
}, | |
easeInBack: function (x, t, b, c, d, s) { | |
if (s == undefined) s = 1.70158; | |
return c*(t/=d)*t*((s+1)*t - s) + b; | |
}, | |
easeOutBack: function (x, t, b, c, d, s) { | |
if (s == undefined) s = 1.70158; | |
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b; | |
}, | |
easeInOutBack: function (x, t, b, c, d, s) { | |
if (s == undefined) s = 1.70158; | |
if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b; | |
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b; | |
}, | |
easeInBounce: function (x, t, b, c, d) { | |
return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b; | |
}, | |
easeOutBounce: function (x, t, b, c, d) { | |
if ((t/=d) < (1/2.75)) { | |
return c*(7.5625*t*t) + b; | |
} else if (t < (2/2.75)) { | |
return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b; | |
} else if (t < (2.5/2.75)) { | |
return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b; | |
} else { | |
return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b; | |
} | |
}, | |
easeInOutBounce: function (x, t, b, c, d) { | |
if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b; | |
return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b; | |
} | |
}); | |
/* | |
* | |
* TERMS OF USE - EASING EQUATIONS | |
* | |
* Open source under the BSD License. | |
* | |
* Copyright © 2001 Robert Penner | |
* All rights reserved. | |
* | |
* Redistribution and use in source and binary forms, with or without modification, | |
* are permitted provided that the following conditions are met: | |
* | |
* Redistributions of source code must retain the above copyright notice, this list of | |
* conditions and the following disclaimer. | |
* Redistributions in binary form must reproduce the above copyright notice, this list | |
* of conditions and the following disclaimer in the documentation and/or other materials | |
* provided with the distribution. | |
* | |
* Neither the name of the author nor the names of contributors may be used to endorse | |
* or promote products derived from this software without specific prior written permission. | |
* | |
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY | |
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF | |
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE | |
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, | |
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE | |
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED | |
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING | |
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED | |
* OF THE POSSIBILITY OF SUCH DAMAGE. | |
* | |
*/ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// JSDeferred 0.3.0 Copyright (c) 2007 cho45 ( www.lowreal.net ) | |
// See http://coderepos.org/share/wiki/JSDeferred | |
function Deferred () { return (this instanceof Deferred) ? this.init() : new Deferred() } | |
Deferred.ok = function (x) { return x }; | |
Deferred.ng = function (x) { throw x }; | |
Deferred.prototype = { | |
init : function () { | |
this._next = null; | |
this.callback = { | |
ok: Deferred.ok, | |
ng: Deferred.ng | |
}; | |
return this; | |
}, | |
next : function (fun) { return this._post("ok", fun) }, | |
error : function (fun) { return this._post("ng", fun) }, | |
call : function (val) { return this._fire("ok", val) }, | |
fail : function (err) { return this._fire("ng", err) }, | |
cancel : function () { | |
(this.canceller || function () {})(); | |
return this.init(); | |
}, | |
_post : function (okng, fun) { | |
this._next = new Deferred(); | |
this._next.callback[okng] = fun; | |
return this._next; | |
}, | |
_fire : function (okng, value) { | |
var next = "ok"; | |
try { | |
value = this.callback[okng].call(this, value); | |
} catch (e) { | |
next = "ng"; | |
value = e; | |
if (Deferred.onerror) Deferred.onerror(e); | |
} | |
if (value instanceof Deferred) { | |
value._next = this._next; | |
} else { | |
if (this._next) this._next._fire(next, value); | |
} | |
return this; | |
} | |
}; | |
Deferred.next_default = function (fun) { | |
var d = new Deferred(); | |
var id = setTimeout(function () { d.call() }, 0); | |
d.canceller = function () { clearTimeout(id) }; | |
if (fun) d.callback.ok = fun; | |
return d; | |
}; | |
Deferred.next_faster_way_readystatechange = ((location.protocol == "http:") && !window.opera && /\bMSIE\b/.test(navigator.userAgent)) && function (fun) { | |
var d = new Deferred(); | |
var t = new Date().getTime(); | |
if (t - arguments.callee._prev_timeout_called < 150) { | |
var cancel = false; | |
var script = document.createElement("script"); | |
script.type = "text/javascript"; | |
script.src = "javascript:"; | |
script.onreadystatechange = function () { | |
if (!cancel) { | |
d.canceller(); | |
d.call(); | |
} | |
}; | |
d.canceller = function () { | |
if (!cancel) { | |
cancel = true; | |
script.onreadystatechange = null; | |
document.body.removeChild(script); | |
} | |
}; | |
document.body.appendChild(script); | |
} else { | |
arguments.callee._prev_timeout_called = t; | |
var id = setTimeout(function () { d.call() }, 0); | |
d.canceller = function () { clearTimeout(id) }; | |
} | |
if (fun) d.callback.ok = fun; | |
return d; | |
}; | |
Deferred.next_faster_way_Image = ((typeof(Image) != "undefined") && document.addEventListener) && function (fun) { | |
var d = new Deferred(); | |
var img = new Image(); | |
var handler = function () { | |
d.canceller(); | |
d.call(); | |
}; | |
img.addEventListener("load", handler, false); | |
img.addEventListener("error", handler, false); | |
d.canceller = function () { | |
img.removeEventListener("load", handler, false); | |
img.removeEventListener("error", handler, false); | |
}; | |
img.src = "data:,/ _ / X"; | |
if (fun) d.callback.ok = fun; | |
return d; | |
}; | |
Deferred.next = Deferred.next_faster_way_readystatechange || | |
Deferred.next_faster_way_Image || | |
Deferred.next_default; | |
Deferred.chain = function () { | |
var chain = next(); | |
for (var i = 0, len = arguments.length; i < len; i++) (function (obj) { | |
switch (typeof obj) { | |
case "function": | |
var name = null; | |
try { | |
name = obj.toString().match(/^\s*function\s+([^\s()]+)/)[1]; | |
} catch (e) { } | |
if (name != "error") { | |
chain = chain.next(obj); | |
} else { | |
chain = chain.error(obj); | |
} | |
break; | |
case "object": | |
chain = chain.next(function() { return parallel(obj) }); | |
break; | |
default: | |
throw "unknown type in process chains"; | |
} | |
})(arguments[i]); | |
return chain; | |
} | |
Deferred.wait = function (n) { | |
var d = new Deferred(), t = new Date(); | |
var id = setTimeout(function () { | |
d.call((new Date).getTime() - t.getTime()); | |
}, n * 1000); | |
d.canceller = function () { clearTimeout(id) }; | |
return d; | |
}; | |
Deferred.call = function (f ) { | |
var args = Array.prototype.slice.call(arguments, 1); | |
return Deferred.next(function () { | |
return f.apply(this, args); | |
}); | |
}; | |
Deferred.parallel = function (dl) { | |
if (arguments.length > 1) dl = Array.prototype.slice.call(arguments); | |
var ret = new Deferred(), values = {}, num = 0; | |
for (var i in dl) if (dl.hasOwnProperty(i)) (function (d, i) { | |
if (typeof d == "function") d = next(d); | |
d.next(function (v) { | |
values[i] = v; | |
if (--num <= 0) { | |
if (dl instanceof Array) { | |
values.length = dl.length; | |
values = Array.prototype.slice.call(values, 0); | |
} | |
ret.call(values); | |
} | |
}).error(function (e) { | |
ret.fail(e); | |
}); | |
num++; | |
})(dl[i], i); | |
if (!num) Deferred.next(function () { ret.call() }); | |
ret.canceller = function () { | |
for (var i in dl) if (dl.hasOwnProperty(i)) { | |
dl[i].cancel(); | |
} | |
}; | |
return ret; | |
}; | |
Deferred.earlier = function (dl) { | |
var ret = new Deferred(), values = {}, num = 0; | |
for (var i in dl) if (dl.hasOwnProperty(i)) (function (d, i) { | |
d.next(function (v) { | |
values[i] = v; | |
if (dl instanceof Array) { | |
values.length = dl.length; | |
values = Array.prototype.slice.call(values, 0); | |
} | |
ret.canceller(); | |
ret.call(values); | |
}).error(function (e) { | |
ret.fail(e); | |
}); | |
num++; | |
})(dl[i], i); | |
if (!num) Deferred.next(function () { ret.call() }); | |
ret.canceller = function () { | |
for (var i in dl) if (dl.hasOwnProperty(i)) { | |
dl[i].cancel(); | |
} | |
}; | |
return ret; | |
}; | |
Deferred.loop = function (n, fun) { | |
var o = { | |
begin : n.begin || 0, | |
end : (typeof n.end == "number") ? n.end : n - 1, | |
step : n.step || 1, | |
last : false, | |
prev : null | |
}; | |
var ret, step = o.step; | |
return Deferred.next(function () { | |
function _loop (i) { | |
if (i <= o.end) { | |
if ((i + step) > o.end) { | |
o.last = true; | |
o.step = o.end - i + 1; | |
} | |
o.prev = ret; | |
ret = fun.call(this, i, o); | |
if (ret instanceof Deferred) { | |
return ret.next(function (r) { | |
ret = r; | |
return Deferred.call(_loop, i + step); | |
}); | |
} else { | |
return Deferred.call(_loop, i + step); | |
} | |
} else { | |
return ret; | |
} | |
} | |
return (o.begin <= o.end) ? Deferred.call(_loop, o.begin) : null; | |
}); | |
}; | |
Deferred.repeat = function (n, f) { | |
var i = 0, end = {}, ret = null; | |
return Deferred.next(function () { | |
var t = (new Date()).getTime(); | |
divide: { | |
do { | |
if (i >= n) break divide; | |
ret = f(i++); | |
} while ((new Date()).getTime() - t < 20); | |
return Deferred.call(arguments.callee); | |
} | |
}); | |
}; | |
Deferred.register = function (name, fun) { | |
this.prototype[name] = function () { | |
var a = arguments; | |
return this.next(function () { | |
return fun.apply(this, a); | |
}); | |
}; | |
}; | |
Deferred.register("loop", Deferred.loop); | |
Deferred.register("wait", Deferred.wait); | |
Deferred.Arguments = function (args) { this.args = Array.prototype.slice.call(args, 0) } | |
Deferred.connect = function () { | |
var target, func, obj; | |
if (typeof arguments[1] == "string") { | |
target = arguments[0]; | |
func = target[arguments[1]]; | |
obj = arguments[2] || {}; | |
} else { | |
func = arguments[0]; | |
obj = arguments[1] || {}; | |
target = obj.target; | |
} | |
var partialArgs = obj.args ? Array.prototype.slice.call(obj.args, 0) : []; | |
var callbackArgIndex = isFinite(obj.ok) ? obj.ok : obj.args ? obj.args.length : undefined; | |
var errorbackArgIndex = obj.ng; | |
return function () { | |
var d = new Deferred(); | |
d.next = function (fun) { return this._post("ok", function () { | |
fun.apply(this, (arguments[0] instanceof Deferred.Arguments) ? arguments[0].args : arguments); | |
}) }; | |
var args = partialArgs.concat(Array.prototype.slice.call(arguments, 0)); | |
if (!(isFinite(callbackArgIndex) && callbackArgIndex !== null)) { | |
callbackArgIndex = args.length; | |
} | |
var callback = function () { d.call(new Deferred.Arguments(arguments)) }; | |
args.splice(callbackArgIndex, 0, callback); | |
if (isFinite(errorbackArgIndex) && errorbackArgIndex !== null) { | |
var errorback = function () { d.fail(arguments) }; | |
args.splice(errorbackArgIndex, 0, errorback); | |
} | |
Deferred.next(function () { func.apply(target, args) }); | |
return d; | |
} | |
} | |
Deferred.retry = function (retryCount, funcDeferred, options) { | |
if (!options) options = {}; | |
var wait = options.wait || 0; | |
var d = new Deferred(); | |
var retry = function () { | |
var m = funcDeferred(retryCount); | |
m. | |
next(function (mes) { | |
d.call(mes); | |
}). | |
error(function (e) { | |
if (--retryCount <= 0) { | |
d.fail(['retry failed', e]); | |
} else { | |
setTimeout(retry, wait * 1000); | |
} | |
}); | |
}; | |
setTimeout(retry, 0); | |
return d; | |
}; | |
Deferred.exports = ["parallel", "wait", "next", "call", "loop", "repeat"]; | |
Deferred.define = function (obj, list) { | |
if (!list) list = Deferred.exports; | |
if (!obj) obj = (function getGlobal () { return this })(); | |
for (var i = 0; i < list.length; i++) { | |
var n = list[i]; | |
obj[n] = Deferred[n]; | |
} | |
return Deferred; | |
}; | |
(function ($) { | |
$.deferred = Deferred; | |
$.fn.extend({ | |
deferred: function(name) { | |
var args = Array.prototype.slice.call(arguments, 1); | |
return Deferred.connect(this[name], { target:this }).apply(null, args); | |
} | |
}); | |
var orig_ajax = $.ajax; $.ajax = function (opts) { | |
var d = $.deferred(), orig = {}; | |
$.extend(orig, opts); | |
opts.success = function () { | |
if (orig.success) orig.success.apply(this, arguments); | |
d.call.apply(d, arguments); | |
}; | |
opts.error = function () { | |
if (orig.error) orig.error.apply(this, arguments); | |
d.fail.apply(d, arguments); | |
}; | |
orig_ajax(opts); | |
return d; | |
}; | |
})(jQuery); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html > | |
<html lang="en"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
<title>JSDeferred / addCommand-like Sample 3</title> | |
<style type="text/css" media="screen"> | |
#wrap { | |
border: 1px dashed; | |
height: 400px; | |
position: relative; | |
} | |
#wrap img{ | |
position: absolute; | |
top: 0px; | |
left: 0px; | |
} | |
</style> | |
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> | |
<script src="./jquery.easing.1.3.js"></script> | |
<script src="./jsdeferred.jquery.js"></script> | |
<script type="text/javascript" charset="utf-8"> | |
$(document).ready(function() { | |
Deferred.define(); | |
var img1 = $("#img1"), | |
img2 = $("#img2"), | |
img3 = $("#img3"); | |
(function() { | |
var callee = arguments.callee; | |
var animate = function (target, prop, speed, easing) { | |
return Deferred.connect(target, "animate", { args: [ prop, speed, easing ] }); | |
}; | |
Deferred.chain( | |
animate(img1, { | |
opacity: 0, top: 90 + "px", left: 260 + "px" | |
}, 1000, "easeInOutCirc"), | |
animate(img2, { | |
opacity: 0, top: 170 + "px", left: 450 + "px" | |
}, 1000, "easeInOutCirc"), | |
animate(img3, { | |
opacity: 0, top: 260 + "px", left: 620 + "px" | |
}, 1000, "easeInOutCirc"), | |
[ | |
animate(img1, { | |
opacity: 1, top: 0 + "px", left: 0 + "px" | |
}, 1000, "easeInBack"), | |
animate(img2, { | |
opacity: 1, top: 0 + "px", left: 0 + "px" | |
}, 1000, "easeInBack"), | |
animate(img3, { | |
opacity: 1, top: 0 + "px", left: 0 + "px" | |
}, 1000, "easeInBack") | |
], | |
function () { | |
return wait(0.5).next(callee); | |
}, | |
function error (e) { | |
alert(e); | |
} | |
); | |
})(); | |
}); | |
</script> | |
</head> | |
<body> | |
<h1>JSDeferred / addCommand-like Sample 3</h1> | |
<p>Inspired from <a href="http://lab.hisasann.com/addCommand/index.html">addCommand.js</a> and its demo <a href="http://lab.hisasann.com/addCommand/demo/sample3.html">Sample3</a></p> | |
<div id="wrap"> | |
<img id="img1" src="http://img.f.hatena.ne.jp/images/fotolife/c/cho45/20100214/20100214145936_120.jpg" width="120px" height="100px"> | |
<img id="img2" src="http://img.f.hatena.ne.jp/images/fotolife/c/cho45/20100213/20100213150241_120.jpg" width="120px" height="100px"> | |
<img id="img3" src="http://img.f.hatena.ne.jp/images/fotolife/c/cho45/20100214/20100214150046_120.jpg" width="120px" height="100px"> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment