使うjQueryロールオーバーさせる為に画像を2枚用意するのが面倒という場合に使う方法です。以前もロールオーバーのサンプルを紹介しましたが、今回はjQueryを使って1枚の画像をロールオーバーっぽく見せる方法の紹介です。'1');});}}});サンプルダウンロード解説このロールオーバーの仕組みは、マウスオーバー時に画像の透過度を変えることでロールオーバーしているように見せています。スクリプトの内容は、まず<img>タグを変数「images」に格納しfor文でimg要素の数だけループさせます。<img>タグの数はsize()で取得します。ここまでは前回のロールオーバーと同じです。{ここからが今回のポイントとなる部分です。画像ファイル名に「_btn.」があるものを対象とします。ロールオーバーさせる画像はファイル名に「_btn.」を入れる必要があります。hoverイベントでマウスオーバー時とマウスアウト時の透過度を設定します。‘1’);」で透過度を100%に戻しています。ロールオーバー対象を識別するファイル名や透過度の設定は任意で変更してかまいません。コメントをキャンセルメールアドレスが公開されることはありません。