テキストにFlashのようなフェードイン等のアニメーションを実装できるjQueryプラグイン「jQuery TextFX」!

2015/09/08

こんにちは。
今回はテキストにFlashのようなフェードイン等のアニメーションを実装できるjQueryプラグイン「jQuery TextFX」!です。

テキストにFlashのようなアニメーションを加える事ができるjQueryプラグインを見つけたので紹介したいと思います。

テキストにFlashのようなフェードイン等のアニメーションを実装できるjQueryプラグイン「jQuery TextFX」!

jQuery TextFX

jquery-text-fX

 

jQueryプラグイン「jQuery TextFX」をダウンロードしてみよう!

jQuery TextFX」からjquery.transit.jsとjquery.textFx.min.jsをダウンロードします。

 

jQueryプラグイン「jQuery TextFX」の使い方

html部分を記述します。

 

jQuery本体とjquery.transit.jsとjquery.textFx.min.jsを/bodyの手前に読み込みます。

 

その下に下記のスクリプトを記述します。

fadeInの場合

 

slideInの場合

 

rotateの場合

 

scaleの場合

 

type
アニメーションのタイプを記述します。
(fadeIn,slideIn,rotate,scale)
iChar
個々の文字の遅延を記述します。
iAnim
個々の文字のアニメーションの時間を記述します。
direction
typeをslideInにした場合に、どの方向からスライドするかを記述します。
(top, left, down, right)

 

プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート
プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート

 

いかがでしたか。簡単にテキストにアニメーションを加える事ができますね。
以上でテキストにFlashのようなフェードイン等のアニメーションを実装できるjQueryプラグイン「jQuery TextFX」!でした。

topへ戻る