人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

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));
}

}

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

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

●質問者: gelgelgel
●カテゴリ:インターネット ウェブ制作
✍キーワード:jQuery イメージ コード ループ 教授
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● koriki-kozou
●40ポイント ベストアンサー

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

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

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

ソースコード

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

◎質問者からの返答

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

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

$(window).load(function() {

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

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

}

});

function Result() {

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

}

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


2 ● Mars
●40ポイント

サンプルです。

$(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/

◎質問者からの返答

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

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

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


3 ● koriki-WeKan
●0ポイント

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

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

が分かりやすい。

◎質問者からの返答

にゃーーーー!!

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ