フェード5■フェードでオン停止リンク全部    最終修正日 : 2016/01/23

※バナー画像は見本なので、該当サイトの本物のバナーではありません。

■画像マウスオンで、スライドショーが停止、クリックでリンク先に飛びます■

●2016/01/23:即時関数で囲んで、グローバル変数を消しました。
綺麗なフェードイン、フェードアウトで自動で切り替わるスライドショーに、リンクを付け、さらにマウスオン停止も追加しました。
バナー画像をクリックすると、リンク先にとびます。

■注意:リンク画像にマウスオンすると、マウスカーソルは手の形になります。
ただこの見本では、JavaScriptの中でリンクURLを記述しなくても、全部手の形のマウスカーソルになるので、リンクを付けたり付けなかったりの場合には向きません。
リンクを付けた時だけマウスカーソルが手の形になるJavaScriptは、■フェード6■フェードでオン停止リンク有り無し■から。
ただし、こちらのリンク先は「他のサイトのURL」ではなく「拡大画像」になっているので、画像ファイル名を URL 名に変更して下さい。

リンクのターゲット指定の説明はこちらから。
■2016/01/23:画像マウスオン停止を追加。
■2016/01/23:マウスオン時に画像が薄くなる効果をCSSで追加。(CSSなので、効果の削除や変更も可)


原本はCSS3とJavaScriptの併用で、イヌでもわかるJavaScript講座から。
少しだけソースを簡略化して、「リンク指定」と「マウスオン停止」を付けました。