まだなにもない空間:IndexJavaScript実験場 Top>画像転換 6
*

JavaScript実験場

画像のロールオーバー -応用編 3-

Index

JavaScript実験場 Topに戻る

完成品

では、早速実装例を以下に置いておきます。 以下のスライドショーの内容は、すべて同じです。

クリッククリック
setTimeout();
setInterval();

それぞれの方式のスライドショーのHTMLソースを、別のページにまとめて用意しておきますね。 テンプレートとして利用したい方は、そちらを参照してください。

テンプレート1:クリック式 / テンプレート2:自動式1 / テンプレート3:自動式2

なお、自動的に進行するスライドショーのスクリプトは、画像を変更する間隔を短くしたりすると、ある程度まではアニメーションのような効果にすることも可能です。 いろいろと工夫すると、面白い効果として利用できるでしょう。

今回は、画像のロールオーバーについて解説してみました。 参考になれば幸いです。 では、お疲れ様でした。

ご意見・ご感想・ご質問・お気付きの点などについては、下記連絡先までお寄せください。
連絡先:ki_ng@mail.goo.ne.jp
inserted by FC2 system