jQuery Text Fade Delayは、テキストをフェードとディレイ(遅延)アニメーションで美しく表示させることができるjQueryプラグインです。blockquote要素が表示されたあとに、cite要素が遅れて表示します。
jQuery Text Fade Delay
以下のページからjQuery Text Fade Delayの実際のデモ動作を確認できます。
デモではテキストがフェードアニメーションで優雅に表示されていきます。最初にblockquote要素に記述した内容が表示され、そのあと遅れてcite要素に記述した内容が表示される仕組みです。
これを1セットとし、その後、次のセットの内容を表示していきます。マークアップはulでリスト形式に記述するので、シンプルでとてもわかりやすいのがいいですね。
オプションには、fadeSpeed、duration、citeDelay、citeFadeSpeedといった項目が用意されています。各項目の数値を調節することで、自分好みのアニメーションにカスタマイズすることが可能です。
デフォルトの値は、fadeSpeedが500、durationが2000、citeDelayが1200、citeFadeSpeedが750です。
また、対応ブラウザは、Chrome 42+、Firefox 39+、Safari 9+、Internet Explorer 10+、Edge 14+をサポートしているとのこと。ライセンスはMIT。
フェードとディレイによるアニメーションで、テキストをかっこよく表示させたいという人は、ぜひ「jQuery Text Fade Delay」を活用してみてはいかがでしょうか?
jQuery Text Fade Delayのダウンロードや具体的な使い方は、以下のページからどうぞ。