●2016/09/10：即時関数で囲んで、グローバル変数を消しました。
フェードイン、フェードアウトで切り替わる、サムネイルのスライドショーです。
小さなサムネイル画像をマウスオーバーすると、拡大画像が変化します。
このJavaScriptは、
小さなサムネイル画像も拡大画像も、同じ画像をサイズ指定を変えて使用しているので、あまり重い画像には向きません。
画像の装飾はCSSで、自分の好みで自由に変更可能です。
原本は
イヌでもわかるJavaScript講座から。
マウスアウトでも画像が消えないように改造しました。
画像は全部が同サイズの画像を使用して下さい。バラバラのサイズでは使用できません。
マウスオーバーからクリックへの変更はできません。
サムネイルを利用したスライドショーは、即時関数に修正することがとても難しいです。
img画像に「onclick="a(this.src)"」「onmouseover="a(this.src)"」等を入れることができません。
今回は
Qiitaを参考に作成しました。
フェードが付かず、マウスオーバーとクリックの選択可のJavaScriptはこちら → サムネイル１■同一画像スライド
■2016/09/13：指定によって位置配置がおかしくなることがあるので１行追加修正。