0

ページのサイズ変更に合わせてレイアウトを動的にサイズ変更できるように、最新の CSS3 ボックス モデルを試しています。問題は、Firefox 3.6 (Chrome で完全に動作) でドラッグ アンド ドロップにバグが発生することです。Firefox なのか、Jquery なのか、それとも自分のエラーなのかわかりません。しかし、ドラッグしているクローン オブジェクトの位置が pos.left に 30px 追加されているように見えます。

つまり、ボタンをタブ領域にドロップすると、#page1 であるドラッグ可能な領域内で適切にロックされません。むしろ、ボタンが神秘的に存在する余分なマージンが 30px あるようです。ボタンをページの下部にドラッグすると、この「マージン」のために、ページ 1 とタブのコンテンツの外に浮いているように見えます。

さらに、firebug を使用してコンテナーの輪郭を描くと、すべて適切なサイズに見えます (おかしなオーバーフローなどはありません)。ただし、outer-container、tab-content、page1、footer 内のボックス モデル コードを取り出し、手動で tab-content の高さを 800px に設定すると、バグはなくなります。

ここで起こっているようです：

  var pos= $(ui.helper).offset();
          objName = "#clonediv"+counter;
          $(objName).css({"left":pos.left,"top":pos.top});

私のコードはここにあります: http://jsfiddle.net/yLCZb/5/

何か案は？？FFで動作させることができれば、このボックスモデルのテクニックを使いたい..

4

1 に答える 1

0

私はjqueryの男ではありませんが、doctypesの混合と一致がFireFoxを混乱させているようです。通常の HTML5 doctype 宣言を試してください:

<!DOCTYPE html>

<script>また、タグから XHTML 構造と「言語」属性を失う必要があります。

チッ！

于 2011-10-11T03:10:08.453 に答える