1

必要な要素がいくつかの余分な html 属性の上に再配置されているページがあります。

例えば：

<div class="contentplate" relativePosition="top-left" relx="1" rely="3" relw="14" relh="8"  relFontSize="80"></div>

クラス「contentplate」によって再配置されます。実際のウィンドウ サイズに関連するラスターに配置されます。子要素は再帰的に処理され、このコンテナー内でも動作する相対的な位置を取得します。これはすべて期待どおりに機能します。

問題は、jQuery('parentcontainer').animate( {left:0},100 ) または何かを使用するときに始まります。何らかの方法で要素の位置を変更すると、jquery は子要素ではなく親要素のみをアニメーション化します。面白いのは、アニメーションが完了した後、子の位置が jQuery によって何らかの方法で修正されることですが、アニメーション化されていないと言われています。

すべての要素のスタイルは position:absolute、overflow:hidden です

いいえ、repsation アルゴリズムは、ウィンドウのサイズが変更された場合、またはページが一度読み込まれた後にのみ実行されます。

興味がある場合は、3 つのテストがあります。
サイトは完全に動的に再配置されます (Firefox を除き、アニメーションは失敗します)
http://www.bourier.org/demos/jquery_animation_failure/test_2.html

アクティブな再配置なしの再配置されたサイトのスナップショット (すべてのブラウザー、すべて良好)
http://www.bourier.org/demos/jquery_animation_failure/test.html

黄色のグリッドが有効になっている完全に動的な再配置サイト
http://www.bourier.org/demos/jquery_animation_failure/test_3.html

ここに画像の説明を入力 グリッドが有効になっている動的ページを表示できるスクリーンショット

4

1 に答える 1

0

どうやら、キャンバスの使用と上記の z オーダーの div の CSS 変更に関連するブラウザ エンジンのバグです。

キャンバスは、デバッグ目的など、グリッド機能が正しいことを確認するためだけに存在します。

キャンバスを削除しましたが、すべてが期待どおりに機能しています。

非常に問題があります。クロム開発者ツールを使用してここに表示できます。要素はデバッガーとマウスポインターによって正しい位置で検出されますが、そこには表示されません。これは非常に奇妙です。

ここに画像の説明を入力

これ以上深く掘り下げたくはありませんが、私の意見では、Firefox の動作は正しく、Chrome と Safari は非常に間違ったことをしています。

クロム開発者に問題レポートを投稿する必要がある場合は、コメントを残してください。

于 2012-11-19T14:58:48.577 に答える