3

この最初の図は、ページが最初にロードされたときの jqTree の外観です。

ここに画像の説明を入力

「USA」ノードを閉じてから再展開すると、次のように再展開されます。

ここに画像の説明を入力

Google Chrome デバッガーで検査すると、次のようになります。

ここに画像の説明を入力

何らかの理由で、overflow: hidden が要素のスタイルに追加されていることがわかります。この要素スタイルを削除/無効にすると、ツリーは期待どおりに機能し、すべてが正常に機能します。

また、ヘッダーからブートストラップ css を削除すると、このバグは発生しなくなりました。

なぜ/いつ/どこで/どのようにブートストラップがこのスタイルを追加しているのか、ここにいる人はいますか? クロムのDOMブレークポイントを要素に追加しました（属性の変更時）が、スタイルは実際にはブレークポイントがヒットする前に設定されるため、さらに混乱します...

このバグは、firefox では発生しません。

助けてください

4

1 に答える 1

3

それは確かに奇妙なものです。この問題は、Bootstrap のデフォルトの影響を受ける可能性がありますが、完全に jQTree スタイルが原因のようですbox-sizing。いずれにせよ、これらのスタイルをスタイルシートに追加してください

ul.jqtree-tree ul.jqtree_common {
    margin-left: 0;
    padding-left: 16px;
}

問題は、これらの矢印が絶対に配置されてleft: -1.5emいたため、親のボックスの外側に配置されていたことです。ではoverflow:hidden、それらは表示されませんでした。

overflowおそらくアニメーションを容易にするために、JQTree JavaScript の何かがプロパティを追加します。

于 2014-03-06T22:51:16.953 に答える