0

私はこのようなdivを持っています:

<div class="class1">
    <div class="class2"></div>
    <div class="class3"></div>
    <div class="class4">
         <div class="class5"></div>
    </div>
</div>

この div はページに複数存在します。

ここで、子要素の一部を削除し、他の要素を再配置して、そのプロセスを正しい方法でアニメーション化したいと考えています。

現在、私はこのようにしています。

例：

var mainElement = $('class1');

mainElement.find('class2').css('property','value');
mainElement.find('class3').remove();
mainElement.find('class4').animate({'プロパティ': '値'});

これは機能しますが、私が望むほどスムーズではありません。一度に 1 つの要素に対して実行すると機能しますが、それでも少し不安定です。ただし、主な問題は、このコードがページの読み込み時に実行され、前に述べたように、複数の要素に同時に適用されることです。その後、アニメーションがまったく表示されなくなるまで、非常に途切れ途切れになります。

誰かが正しい方法でそれを行う方法を私に説明できますか?

たとえば、 $('class1').fadOut() は、同時に 50 個の要素に対しても非常にスムーズに動作します。

こんにちは、アンディ

4

1 に答える 1

0

何をアニメーション化しているのか正確にはわかりませんが、ページのリフローが発生するような方法で div を移動すると、パフォーマンスが低下します。div を絶対位置に配置して、ページ フローから外してみてください。フェードはレイアウトに影響を与えないため、うまく機能します。

于 2013-03-10T13:30:32.820 に答える