2

問題を説明するために少しフィドルを作りました。

基本的にこれは機能します：

var visible = $('#container').find(' > div:visible'),
    hidden = $('#container').find(' > div:hidden');

visible.fadeOut(1000, function() {
});
setTimeout(function() { hidden.fadeIn('slow') },1000);

これはしません：

var visible = $('#container').find(' > div:visible'),
    hidden = $('#container').find(' > div:hidden');

visible.fadeOut(1000, function() {
    hidden.fadeIn(100)
});

2 番目の方法では、ページがフリーズします。

コールバックの使用方法に何か問題がありますか?

すべてを実行できる必要があるため、アニメーション キューに配置できる必要がありstop()ます。

これを機能させる方法はありますか？私はChromeとFFで壊れています

4

2 に答える 2

4

2番目のソリューションの問題は、表示されているdivごとにアニメーションが開始され、アニメーション（終了した）ごとにすべての非表示のdivがアニメーションのフェードを開始することです。

于 2012-05-17T11:58:41.373 に答える
0

ええと、まず第一に、なぜそのような構造を使用しているのですか:

 $('#container').find(' > div:visible');

使用するだけです：

 $('#container > div:visible');

次に、使用しないでください。#container何らかの理由で、内部の301要素に対してフェードアウトが発生すると、多すぎます。

それをスクラッチすると、jsfiddle が変更されたことがわかり、現在は 1 つの要素しかありません。以前にクラッシュしたことに驚かないでください - オブジェクトが多すぎます。

第 3 に、fadeOut の後、何もフェードインしません。これは、非表示の変数を割り当てた時点で非表示の div がないためです。これをコールバックで使用する必要があります。

 $('#container2 > div:hidden').fadeIn(1000)
于 2012-05-17T12:04:42.893 に答える