- 2010-03-13 (土)
- 技術
なんとなく思い立って、jsDeferred.jsでアニメーションのループがしてみたいってなったので作ってみた。
この手のアニメーションを考えるときは、どちらかというと間違ったコードが面白さを生み出す。
つまり、不意に間違って2回ループしたら面白いや、ストーリーの組み直しなどで型にハマらない動きができたりする。
ここ最近は拙作のaddCommand - jQuery Pluginでアニメーションを書いていたんですが、jsDeferredも便利ですね〜。
処理の割り込みや、setTimeoutで待たせるときに使ったりしてましたが、アニメーションでも十分に使いやすい。
cho45's jsdeferred at master - GitHub
サンプルコード - jsDeferred.js
ストーリーのループは以下のようにfunctionのcalleeを最後のnextで呼ぶようにしてあげてます。
これで疑似無限ループの完成。
あとjQuery1.4以降の機能でeasingをCSSプロパティ毎に指定できるので、それで少し気持ち悪い動きをくわえてみたりしてます。
Firefoxでも頑張って動いてくれますが、ChromeかSafariのほうが軽快に動作します。
以下からどうぞ。
squareDeferred
プログラムコード
・gist: 331150 - GitHub
- Newer: space - HTML5 & CSS3 DEMO
- Older: flickrダラ見サイト - flickrer作ってみた
Trackback:0
- TrackBack URL for this entry
- http://hisasann.com/cgi-bin/mt/mt-tb.cgi/1250
- Listed below are links to weblogs that reference
- squareDeferred from HouseTect, JavaScriptな情報をあなたに
