yeffectsとは、jQueryを利用したJavaScriptアニメーション制作補助ライブラリです。
jQueryではフェードインなど単発のアニメーションは簡単に記述できますが、あるアニメーションを開始してそれから約0.1秒後に別のアニメーションを開始・・・というような複雑なアニメーションを実現しようとすると少々処理を記述しなければなりません。
yeffectsを使うと、複雑なアニメーションを比較的簡単な宣言によって実現することができます。
こんな風に:
サンプル:
(「実行!」ボタンを押すと、ヌーーーーという文字がだんだん現れます。)
コード:
yeffectsでは、基本的にはアニメーションを
並列(Parallel)、
順序(Sequence)、
待機(Wait)、
スタイル変化(Animate)の組み合わせで表現します。
(要素をカスタムで追加することもできます。
この考え方はSMIL(Synchronized Multimedia Integration Language)を参考にしています。)
たとえば、上記のサンプルならば、以下のような形式でアニメーションを表現しています。
これらの要素を組み合わせれば、複雑なメニュー表示アニメーションなどを、オブジェクト定義だけで実現することができます。
詳しくはリファレンスを参考にしてください。
このライブラリは
MIT Licence(日本語訳)
に基づき配布をおこなっています。
もし使用してくださる方がおられる場合は、以下の点にご注意ください。
だんだんと充実させていく予定。