クロスブラウザーjQuery遷移アニメーション？
https://stackoverflow.com/questions/459302
-
19-08-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian質問
Firefox 3とIE7の両方で動作するjQuery 1.3アニメーション遷移はありますか？
複数のテーブル行（25以上）を持つテーブルがあり、一部の行は非表示になっています（これらの行はすべて共通のクラスを共有しています。この例では、<！> quot; .hidden <！> quot; ）。表のヘッダーには<！> quot; Show more <！> quot; .click（）を介して非表示の行を表示する関数にバインドされたリンク。次に<！> quot; Show more <！> quot;を変更します。 to <！> quot; Show less <！> quot; .click（）を反対の機能を実行する関数に変更します。
各.click（）関数には、次のような行があります
$(this).parents("tbody").children("tr.hidden").show();
.show（）を.hide（）に置き換え関数。
ただし、.show（）/。hide（）を.fadeIn（）/。fadeOut（）に置き換えようとすると、IEは、.show（）/。hide（）とほぼ同じようにレンダリングしますが、 .hide（）が有効になるまでの時間。実際のアニメーションはありません。 IEでは劣りますが、すばらしいFirefoxで動作します。
.slideDown（）/。slideUp（）を使用しようとすると、IEでも同様にジャンキーであり、トランジション完了直後の奇妙なパルス効果を除いて、.show（）/。hide（）とほぼ同じです。 Firefox 3もそれを抑制し、表示されているテーブル行の行幅を忘れてしまい、全体がひどく見えるようになりました。
それで、アニメーションはIE7で吸い込まれますか？この場合、両方のブラウザーで動作する、スムーズでスムーズな移行を行う方法はありますか？
解決
jQueryの互換性ページによると、この種の問題はバグであり、報告する必要があります。
他のヒント
IEでは、複数の同時アニメーションを作成するのが難しい場合があります。 Javascriptエンジンは、Safari、Firefox、Chromeの近くにはありません。これはIE6とIE7に当てはまります。私はまだIE8を使用していません。
少し役立つのは、アニメーション化しようとしている要素に静的な高さを設定することです。 CSS /レイアウトの観点からは、これは通常理想的ではありませんが、...これにより、jQueryは各要素の高さをアニメーション化する前に各要素の高さを最初に計算しなければならないタスクをスキップできます。
一般に、一眼レフカメラと同じ方法でアニメーションにアプローチできます。 （ここで私と一緒にスティック）。スポーツイベントの連射ショットを撮影しようとしている場合、写真家なら誰でも事前にフォーカス、ISO、シャッタースピードを設定することをお勧めします。このように、カメラは各ショット間でこれらすべてを計算する必要はなく、シャッターボタンを押したままクリック-クリック-クリック-クリックするだけです。 Aチームスタイル。
とにかく、アニメーションに関して言えば、アニメーションが発生するためにJavaScriptが計算する必要があるものを考えてみてください。不透明度、高さ、計算された高さ（要素の幅+ボーダー+パディング）、画面の位置は、すべて開始するのに適した場所です。
多くの場合、アニメーションの開始時にjQueryがDOMに追加する内容を実際に確認できます（ Firebug を使用） 。同様に、不透明度アニメーションでは、style = <！> quot; opacity：1; <！> quot; 0へのカウントダウンが始まる直前に追加されます。
ブラウザ間でのパフォーマンスについて話すとき、私はあまり明確にしないでしょう。率直に言って、FFとIEがWebkitをうまく処理しながら、Webkitを泣かせるような重いJSアニメーションを見てきました。
ブラウザは、CSSとJSの実装が異なるため、パフォーマンスの低下の原因を突き止めるのが困難になることを考慮する必要があります。
IEを取得します。ブロックレベル要素4000x4000と2x2透明gifを繰り返すように設定している場合、禁止するたびに要素IEを移動すると2x2 gifが再描画され、それぞれのアルファが2000倍以上計算されます。 FFは、バックグラウンドをキャッシュするか、劇的に異なる再描画を行います。どちらの場合も、パフォーマンスは比較できません。マニュアルでは、どのように、何をしているのか注意する必要があるとは言わなかった。
