●2016/09/10:即時関数で囲んで、グローバル変数を消しました。
コメントもtitleも付いてないフェードのJavaScriptはこちら → サムネイル1F■フェード同一画像スライド
上記のJavaScriptを改造しました。
titleの付いたサムネイルのフェードのスライドです。
小さなサムネイル画像をマウスオーバーすると、フェードイン、フェードアウトで拡大画像が変化します。
titleとは、サムネイル画像にマウスオンした時に表示される、画像の説明文です。
説明のコメント用スペースが無くても、画像内容がわかります。
このJavaScriptは、
小さなサムネイル画像も拡大画像も、同じ画像をサイズ指定を変えて使用しているので、あまり重い画像には向きません。
原本は
イヌでもわかるJavaScript講座から。
マウスアウトでも画像が消えないように改造しました。
画像は全部が同サイズの画像を使用して下さい。バラバラのサイズでは使用できません。
マウスオーバーからクリックへの変更はできません。
即時関数のマウスオンの記述方法は、
Qiitaを参考にしました。
フェードが付かず、マウスオーバーとクリックの選択可のJavaScriptはこちら → サムネイル1-1■同一画像スライドtitle付
■2016/09/13:指定によって位置配置がおかしくなることがあるので1行追加修正。