背景をアニメーションで変更する軽量(1.4KB)のスクリプトを紹介します。

デモではCSSのみの動作と比較して、ふわっと光るように背景が変更するエフェクト、アニメーションが繰り返すループモード、オンとオフが入れ替わるリバースモードが楽しめます。
実装方法は簡単で、背景の変更はスタイルシートで行い、jQueryとBlendを外部ファイルとして下記のスクリプトを記述します。
スクリプトではアニメーション機能を追加するだけなので、スクリプトのオフ時にはスタイルシートで指定した通りに動作します。
スクリプトのオプションでは、エフェクトの種類、スピード、不透明度などが変更できます。
BlendはjQueryのプラグインのため、実装にはjquery.jsが必要です。
対応ブラウザはIE6/7/8, Fx2/3, Op9, Safari3/4, Chromeとなっており、ライセンスはMIT Licenseとのことです。
Post on:2009年7月10日



