[JS]背景画像をアニメーションさせるjQueryのプラグイン -jAni

再生や一時停止、停止などコントロールも可能な、背景画像をアニメーションさせるスクリプトをajaxBlenderから紹介します。

デモのキャプチャ

jAni
demo

スクリプトの設置も簡単で、下記のようになります。

JavaScript

外部スクリプトとして、2ファイル記述します。

CSS

背景画像をスタイルシートで配置します。
デモで使用している画像はsample-animation.gifです。

HTML

背景画像を表示する要素(div)を配置します。

JavaScript

スクリプトに表示の設定を指定します。

設定では、背景画像のサイズ、スピード、フレーム数、ループ対応、が指定できます。

また、コントロール機能も設置が可能で、再生、一時停止、停止の3つのメソッドがあります。

sponsors

top of page

©2018 coliss