jQueryの繰り返し処理に関する記述の質問です。


画像を一定時間ごとにずらしてフェードイン表示したいと考えております。
実際のコードは以下のとおりなのですが

$(window).load(function() {
 $('.result1').fadeIn(600,Result2);
});

function Result2(){
 $('.result2').fadeIn(600,Result3);
}

function Result3(){
 $('.result3').fadeIn(600,Result4);
}

function Result4()...(以下続く)

これを

for($i=0;$i<10;$i++){

 function Result.$i(){
   $('.result'.$i).fadeIn(600,Result($i+1));
 }

}

のようにループして記述したいと考えております。
(上記はあくまでも記述のイメージです)
実際にはどの様な記述をすればよいのでしょうか。

ご教授のほど宜しくお願い致します。

回答の条件
  • URL必須
  • 1人1回まで
  • 13歳以上
  • 登録:2010/06/16 03:52:18
  • 終了:2010/06/21 11:30:35

ベストアンサー

id:koriki-kozou No.1

koriki-kozou回答回数480ベストアンサー獲得回数792010/06/16 05:12:55

ポイント40pt

順にフェードインさせたいって事なら下記サンプルに習ってみて

fadeIn([speed], [callback]) - jQuery 日本語リファレンス

http://semooh.jp/jquery/api/effects/fadeIn/%5Bspeed%5D,+%5Bcallb...

ソースコード

http://semooh.jp/jquery/api/effects/fadeIn/%5Bspeed%5D,+%5Bcallb...

id:gelgelgel

ご回答ありがとうございます。

↓こんな感じで良いのでうまくいきました。

$(window).load(function() {

for(i=1;i<=4;i++){

setTimeout("Result()", 600*i);

}

});

function Result() {

$("div:hidden:first").fadeIn(1000);

}

ありがとうございました。

2010/06/16 16:19:30

その他の回答(2件)

id:koriki-kozou No.1

koriki-kozou回答回数480ベストアンサー獲得回数792010/06/16 05:12:55ここでベストアンサー

ポイント40pt

順にフェードインさせたいって事なら下記サンプルに習ってみて

fadeIn([speed], [callback]) - jQuery 日本語リファレンス

http://semooh.jp/jquery/api/effects/fadeIn/%5Bspeed%5D,+%5Bcallb...

ソースコード

http://semooh.jp/jquery/api/effects/fadeIn/%5Bspeed%5D,+%5Bcallb...

id:gelgelgel

ご回答ありがとうございます。

↓こんな感じで良いのでうまくいきました。

$(window).load(function() {

for(i=1;i<=4;i++){

setTimeout("Result()", 600*i);

}

});

function Result() {

$("div:hidden:first").fadeIn(1000);

}

ありがとうございました。

2010/06/16 16:19:30
id:Mars No.2

Mars回答回数203ベストアンサー獲得回数202010/06/16 10:29:30

ポイント40pt

サンプルです。

$(function(){
	sample('.result',600);
});
function sample(selector_base,delay) {
	var ct=1;
	sample_sub();
	function sample_sub(){
		var selector = selector_base + ct++;
		if($(selector).length)
			$(selector).fadeIn(delay,sample_sub);
	}
}

http://semooh.jp/jquery/

id:gelgelgel

ご回答ありがとうございます。

まだ実際に試していませんが、こちらも別のアプローチですごくいいです。

後ほど試させていただきます。

2010/06/16 16:24:15
id:koriki-WeKan No.3

koriki-WeKan回答回数342ベストアンサー獲得回数202010/06/16 12:16:01

jQueryで簡単にフェードイン フェードアウト表示させる方法

http://ameblo.jp/linking/entry-10211188441.html

が分かりやすい。

id:gelgelgel

にゃーーーー!!

2010/06/16 16:24:17
  • id:koriki-kozou
    koriki-kozou 2010/06/16 06:08:03
    追記:
    回答は、呼び出される度にオブジェクトを順にフェードインしていくサンプル
    クリックで順次フェードインが実現できたら クリックではなく setInterval() や setTimeout() などで順次呼び出すようにする


    http://www.geocities.jp/miyake_kobo/js/koubun_002.html

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません