最近のブラウザには標準搭載されているハイライト(強調表示)機能。
入力した検索キーワードの背景が黄色くなるアレです。
jQueryをつかって似たような事ができるプラグインはこちら
使い方はjQueryらしく、いたってシンプル。
まずは、ハイライト時のスタイルを定義してあげる。
この際のクラス名は「highlight」固定らしい 。
まぁ、ハイライトっていったら背景色黄色でしょ、って事で、こんな感じ
<style type=”text/css”>.highlight {background-color:yellow;}</style>
これで準備OK。
あとは
<script type=”text/javascript” src=”jquery.js”></script><script type=”text/javascript” src=”jquery.highlight-3.js”></script><script type=”text/javascript”>function doHighlight() {$(“ハイライトさせたい要素のクエリ”).highlight(“ハイライトさせたい文字列”);}</script>
これでOK。
サンプルも作ってみました。
相変わらずjQueryは簡単で助かる。
1 Comments.