- ベストアンサー
jQuery & 下記のスクリプトにて画像のフェードイン・アウトで切り
jQuery & 下記のスクリプトにて画像のフェードイン・アウトで切り替えるスクリプトについてご質問です。 http://medienfreunde.com/lab/innerfade/ html のロード時に数枚の切り替え予定の画像がスクリプトが 読み込まれる前に全部表示されてしまって格好が悪いので、 表示させないようにする為には、どうすればよろしいでしょうか？ 特に上記のスクリプトを用いなくても代替えのスクリプトがあれば、そちらでも構いません。
- kazuya88
- お礼率28% (38/134)
- JavaScript
- 回答数1
- ありがとう数4
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
CSSなどで初期設定を非表示にしておくか、最初はHTML内に記載しないようにしておくなどのようにすれば、表示されることはありません。 ご提示のスクリプトは見ていませんが、一定時間ごとに画像を切り替えるだけでよいのなら… <head><title>test</title> <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript"> <!-- var img = []; (function() { var imgSrc = "A.jpg,B.jpg,C.jpg,D.jpg".split(","); //イメージの読み込み for (var i=0; i<imgSrc.length; i++) { img[i] = new Image(); img[i].src = imgSrc[i]; } })(); //表示の切替え speed:fadeInの速度、interval:画像切替え間隔 $(function() { var count = 0, interval = 5, speed = 2; $("#screen img:first").clone().css("position","absolute").css("zIndex","10").hide().prependTo("#screen"); setInterval( function() { $("#screen img:first").attr("src", img[count].src).fadeIn(speed*1000 , function() { var tmp = $("#screen img:first").attr("src"); $("#screen img:last").attr("src", tmp); $("#screen img:first").hide(); }); count = ++count%img.length; }, interval*1000); }); //--> </script> </head> <body> <div id="screen" style="position:relative;"> <img src="default.jpg" alt="#"> </div> </body> </html> --------------------------------------------- 「ご質問」をなさる質問者様が多いのはなぜだろうか…？
お礼
＞「ご質問」をなさる質問者様が多いのはなぜだろうか…？ そう言われてみれば確かにその通りですね。。