使用するライブラリは「jQuery」のみ！
マウスが重なった画像をハイライトにし、他の画像をグレーアウトにする――。この効果を取り込むのに使うのは、多くのWebサイトで利用されているJavaScript/Ajaxライブラリ「jQuery」だけです。他に使用するライブラリはありません。
というのも、いつもであれば、同等の効果を実現できる単機能のライブラリを使いますが、今回は使いやすい適当なものが見つからなかったので、jQueryを使って自作することにしたいと思います。“自作”とはといっても、jQueryを使えば数行の記述で済み、あっという間です。
ではさっそく、jQueryをダウンロードして準備しましょう……と説明を続けたいところですが、前回の連載でjQuery上で動くライブラリ「Photo Slider」を使用しているので、今回、jQueryを新たにダウンロールする必要はありません。前回ダウンロードしたjQueryライブラリファイルをそのまま利用しましょう。初めてダウンロードする場合は関連記事を参照してください。
今回の作例サイトは、以下のようなスクリプトファイル／スタイルシートファイル／HTMLファイルで構成されています。
