ロールオーバースクリプト（画像名のOn/Offで判別）とマウスオーバーでリンク画像の透明度とか変更を足してクラスにしてみた。
指定エリア以下のaタグ拾ってマウスイベントでロールオーバーする。
画像名に指定した文字列があれば置換、なければ透過処理。
ロールオーバーさせない指定はclass名の有無（imgタグ内）で判断する。
rollover
[js]ColorMeShop!Pro商品詳細用 ロールオーバースクリプト
ColorMeShop!Proの商品詳細ページの拡大画像表示について。
この記事はサムネイルにマウスオーバーしたら画像を切り替える方法を使用したメモです。
前にLightboxを使う方法を書いてますがどちらにするかはお好みで。
元エントリーのスクリプトを若干変えただけですが、XHMTL・CSS・Javascriptをまとめて貼っておきます
[JS]マウスオーバーでリンク画像の透明度とか変更
マウスオーバーの画像作るのﾒﾝﾄﾞｸｾｰと思ったときに、画像１枚でごまかせるから便利。
普通のロールオーバーよりも凝ったことも出来るので手抜きに見えない所が良いですｗ
難点はjavascriptオフで効果がなくなることですが、
javascriptを意識的にオフしてる人というのは限られてるので大丈夫だと思います。
prototype＆script.aculo.us、jQuery、mootoolsでそれぞれ書いてみた。
[mootools]サムネイルクリックで画像とコメントを変更する
前に書いたサムネイルにマウスオーバーしたら画像を切り替える を、
mootools1.2使ってフェードインとかつけたサンプル。
注意※ソースはmootools1.2用なので1.1では多分動きません。
[JS]サムネイルにマウスオーバーしたら画像を切り替える
大きい画像１箇所とサムネイルいくつか配置して、サムネイルにマウスオーバーしたら大きい画像をサムネイルのやつに変更するスクリプト。
テーブル版、複数設置版、クロスフェード版の他、jQuery版とMooTools版も書きました。
シンプル版
thumbsというIDにあるimgタグを自動収集して、srcから_thumbを抜いたものを
viewに入ってるimgのsrcへ置換します。
[js]ロールオーバー＋見てるページのメニュー画像変更
メニュー画像をロールオーバーさせつつカレントページはon状態にするスクリプト。
見てるページのメニュースタイルを変更すると
ロールオーバースクリプト（画像名のOn/Offで判別）を足したソースです。
プリロードはついてません。
[JS]ロールオーバースクリプト（ソース変更なし）
ＨＴＭＬ側の変更なしで、メニュー内の画像を全部ロールオーバーさせるスクリプトを作ってみた。
relにしろclassにしろイベントハンドラにしろ、ロールオーバーさせるためだけに追加するのは嫌、という時に良いかも。