ASCII.jp：jQueryでロールオーバー！プリロード対応版 (1/3)｜Web制作の現場で使えるjQuery UIデザイン入門※この記事は「Web制作の現場で使えるjQuery UIデザイン入門」の第17回です。過去の記事もご覧ください。 ロールオーバーは、画像にマウスカーソルを重ねたときに自動的に別の画像に表示を切り替える効果です。非常にポピュラーなUI表現として、ナビゲーションメニューなどに広く使われています。今回は、ナビゲーションメニューバーを例に、jQueryを利用してロールオーバー効果を設定する方法を紹介します。 今回制作するサンプル ロールオーバー効果付きメニューバーの完成画面。メニューボタンにマウスカーソルが重なると別の画像を表示する。画像がクリックできることをユーザーに視覚的に伝えられるメリットがある（画像クリックでサンプルページを表示します） ロールオーバーの基本的な仕組みを作ろう 最初に、もっとも単純な方法でロールオーバー効果を作成してみましょう。画像（img要素）の上にマウスカーソルが重なる
