highlight: JavaScript text higlighting jQuery plugin

ページ内のテキストを動的に分かりやすくハイライトさせられるjQueryプラグイン「highlight」。
検索エンジンから来た時や、ユーザの入力に応じてインタラクティブにテキストをハイライトできると色々と分かりやすい場面が結構ありそうな気がします。

普通のテキストサイトがあったとして



文字をハイライトさせることで望んでいるテキストがどこにあるか一発で分かります。ページ内検索で１つづつ辿るよりも分かりやすいですね。



使い方は、.hightlight { /* スタイル */ } のようにスタイルを定義しておいて、$(element).highlight('ハイライトさせたいテキスト'); とやればエレメント内のテキストをハイライトさせられます。
スタイルも自分で定義できるのは便利。

$(element).removeHighlight() で簡単にハイライトをキャンセルすることも出来ます。

ユーザビリティ向上のために覚えておいてよさそうですね。

関連エントリ

• jQueryでテキストにエフェクトをかけたりアニメーションさせたりするプラグイン集
• テキストにグラデーションをかけられるjQueryプラグイン「True Gradient Text」
• Webのテキストをもっと分かりやすく出来そうなラベル作成用jQueryプラグイン「jQLabel」。