jQuery Type-Writing Hint

概要

jQuery Type-Writing Hintは、jQueryのプラグインとして動作します。
検索ボックスなどにユーザの入力を促したい場合、Warter-markなどと呼ばれる入力ヒントを表示しておくことがあります。
このプラグインは同様の働きを期待するものですが、タイプライターのように入力をリアルタイムに見せる点が異なります。
見た目にはやや鬱陶しいですが、複数の単語をローテーションさせることが可能です。

動作

使い方

まずjQuery本体が必要になります。
jQueryそのものの導入については、別途ドキュメントなどを参照してください。

jQuery Type-Writing Hintは、本家プラグインページのリポジトリか、githubから入手してください。

実行は、対象となるテキストボックスに対してtwhintメソッドを呼び出すだけです。
このページに充てたコードは、次のようなものです。

$('#s').twhint({
  hint: ['jQuery', 'WordPress', 'コナミコマンド']
});

オプション

jQuery Type-Writing Hintは、いくつかのオプションで動作を指定することができます。
オプションは他の多くのプラグイン同様に、メソッドの引数としてオブジェクトを渡してやることで指定可能です。

hint
入力ヒントとして表示させたい単語を配列で渡します。
speed
タイピング速度を指定します。
delay
単語が最後まで入力されてから、次の単語入力に移るまでの待ち時間を指定します。
hintClass
ヒントの入力ボックスにのみあてるクラス名を指定します。
hintCss
ヒントの入力ボックスにのみあてるCSSオブジェクトを指定します。

ライセンス

コードにも記載していますが、MITとGPLのデュアルライセンスとします。
全く自由に使っていただいて構いませんが、どこかで利用したり紹介していただいた際は、ご一報いただけると喜ぶと思います。

このエントリーをはてなブックマークに追加
Bookmark this on Yahoo Bookmark
Bookmark this on Livedoor Clip
Share on FriendFeed
Share on StumbleUpon
Newsing it!