no-image

JavaScript

テキストリンクをタイピングアニメーションで表示するjQueryプラグイン「jTyper」

jTyperはテキストリンクをタイピングアニメーションで表示できるjQueryプラグインです。シンプルなアニメーションなので煩わしさを感じさせずにユーザーの目を引くことができます。使い方も簡単なので、サクッと気軽に実装できるはず。

jTyper

デモ

デモではテキストリンクがタイピングされているようなアニメーションで表示されます。一つの文が終了すると、そのテキストリンクが消えて次のテキストリンクがタイピングされ始めます。シンプルながらもちょっとした動きを加えることで、思わず注目してしまいますね。

マークアップもかなり分かりやすく、ulのli要素に各リンクとテキストをマークアップしていけばOKです。また、オプションからスピードの調整やタイムアウトの指定も可能になっています。デフォルト値はspeedが100、timeoutが3000になります。

speedはタイピングのスピードで、timeoutは次のリンクをタイピングするまでの待機時間になります。

というわけで、テキストリンクにタイピングアニメーションを加えて表示するjQueryプラグイン「jTyper」の紹介でした。

関連記事

  1. ssi-modal

    JavaScript

    フレキシブルでパワフルなモーダルウィンドウを実装できる「ssi-modal」

    ssi-modalはカスタマイズ性に優れたフレキシブルでパワフルなモー…

  2. OverlayScrollbars
  3. jQuery gantt

    JavaScript

    軽量なガントチャートを実装できるjQueryプラグイン「jQuery gantt」

    jQuery ganttは、軽量でシンプルなガントチャートを実装するこ…

  4. jQuery Reel Plugin

    JavaScript

    上下左右の色んな角度から画像を回転させて見せることができる「jQuery Reel Plugin」

    これは面白いですね。画像を上下左右と色んな角度から回転させながら見るこ…

  5. JavaScript

    テキストを中央に向かうにつれて大きくしたりできるjQueryプラグイン「jqIsoText」

    結構おもしろかったのでメモしときます。テキストに簡単なエフェクトをかけ…

  6. JavaScript

    チルトシフト効果でミニチュア風の写真に仕上げてくれるjQueryプラグイン「tiltShift.js…

    指定した画像にチルトシフト効果をプラスしてミニチュア風にしてくれるjQ…

最近の記事

  1. Dyson Pure Cool Me
  2. ルック セレクション
  3. シルキーウインドモバイル
  4. アリエール パワージェルボール3D

アーカイブ

PAGE TOP