[JS]サムネイルにマウスオーバーしたら画像を切り替える

16年前

大きい画像１箇所とサムネイルいくつか配置して、サムネイルにマウスオーバーしたら大きい画像をサムネイルのやつに変更するスクリプト。
テーブル版、複数設置版、クロスフェード版の他、jQuery版とMooTools版も書きました。

シンプル版

thumbsというIDにあるimgタグを自動収集して、srcから_thumbを抜いたものを
viewに入ってるimgのsrcへ置換します。

カスタマイズする場合はforの変数iが1から始まっている事に注意。
これは取得したimgの配列から先頭にあるimg#rollover_viewを飛ばすためです。
逆配置にする場合は、0スタートで(myImg.length-1)とする。

大きい画像とリストのIDをクラスに変更。親のIDを指定して実行します。

素のJavaScriptに特別なこだわりがあるわけでないのなら、
MooToolsとかjQueryを使ったギャラリープラグインを使う方がお手軽だと思う。

バージョンは1.5で組みましたが1.3以上なら使えるんじゃないかなと。
プラグイン形式です。

バージョン1.3対応。

ZIPにはリスト版・テーブル版・マルチ版・クロスフェード版のhtmlファイルと画像、元のpsdファイルをまとめてあります
ダウンロード：[ダウンロードが見つかりません]