Lettering.jsを併用して、任意のテキストにCSS3のアニメーションエフェクトを実装するスクリプト・textillate.js

ちょっと面白かったのでメモ的に。タイポグラフィ用のライブラリ、Lettering.jsを併用して、テキストにCSS3によるアニメーション効果を容易に与える事が出来る、というスクリプトのご紹介。 使いどころは限定されますが、動きが面白かったのでメモ的に。以前ご紹介したLettering Animateを少し進化させたような感じ。 エフェクトの種類もかなり用意されているのでデモを見てるだけでも楽しかったです。lettering.jsはjQueryのプラグインなので必然的にtextillate.jsもjQuery依存となります。 lettering.jsで1文字1文字のエフェクトにタイムラグを発生させる事が出来ます。 $('.foo') .fitText(0.5) .textillate({ in: { effect: 'flipInY' }});オプションでエフェクト等をセッティングします。

[hanagejet]

テキストを動かすやつ作ろうと思ってたので使えそう。

[typista]

ぽけったー Lettering.jsを併用して、任意のテキストにCSS3のアニメーションエフェクトを実装するスクリプト・textillate.js

[tsuki-rs]

こりゃモテるわ。