2

ブラウザゲームを開発しています。今まで全位置アブソリュートを使用していました。そのため、すべてのページの高さを自分で設定する必要があります。今、この問題を解決しようとしていますが、すべての場所で絶対位置を使用しているため、ブラウザーが常に div の正しい高さを計算できません。

これを達成することは可能ですか？たとえば、div があり、位置絶対機能を使用する多くの div があります。したがって、このメイン div で、ネストされた div の高さの合計である高さを自動的に計算する必要があります。現在、私が試したものはすべて失敗しました。高さ自動を設定した場合、高さを 1 ピクセルとして計算し、高さをメイン div の 100% に設定した場合、557 ピクセルとして計算します。

ありがとうございました。

4

3 に答える 3

6

いいえ、純粋な CSS では、親要素のサイズを自動的に変更して、配置されたすべての子を含めることはできません。

編集： jQueryで可能かどうか尋ねました。子供のいずれかが変更されるたびに知っていれば、そうです。このコードは、親がオフセットの親であることを前提としています (つまり、position以外にも設定されていますstatic)。

// element is a jQuery object
var max=0;
element.children().each(function(index, child) {
    child=$(child);
    var childPos=child.position();
    var childMax=childPos.top+child.outerHeight();
    if(childMax>max) {
        max=childMax;
    }
});
element.css({height: max+'px'});

JSFiddle で jQuery ソリューションを試してください。

于 2011-09-10T02:36:21.380 に答える
2

Position: absolutediv が通常の流れの外にあることを理解する必要があります。つまり、div が別の div 内にある場合でも、レンダリングされると、すべての div の外になります。したがって、それらは事実上「外側」にあるため、「内側」にあるものを計算することはできません。

于 2011-09-10T02:38:27.553 に答える
1

CSS を使用して位置を読み取ることができます。次のように CSS を使用して上下を計算しようとしているように感じます。

documnent.getElementById('theDiv').style.left;

ただし、ブラウザが計算するオフセットに依存する必要があります。正確な正しい位置を読み取るにはoffsetTop、offsetLeft

documnent.getElementById('theDiv').offsetLeft; //gives you right number.

CSS の左の値が offsetLeft と異なる理由は、CSS の左が要素間のスペースの量であり、その最初の相対的な親がブラウザの端ではなく左端であるためです。

jQuery を使用したい場合は、位置を示す 2 つの jQuery メソッドがあります。1 つは.position()で、もう 1 つは.offset()です。オフセットはあなたにぴったりです。

于 2011-09-10T02:39:35.957 に答える