目に見えないオブジェクトの高さ（JavaScriptが表示されているとき）

Question

私はタブ構造を表すテーブルを持っています。
一部のセルはdisplay：noneに設定されています。アクティブなタブのみが表示されます。 最大高さをすべてに設定したい。それを行うには 、私はタブの配列を通過すると、次の

// get the max-tab-height 
for (var i = 0; i < TabPageList.length; i++) 
{ 
    // get max height 
    if (TabPageList[i].offsetHeight>MaxTabHeight) 
     MaxTabHeight = TabPageList[i].offsetHeight;   
} 

を行うこの方法の問題点は、offsetHeightのみが表示され、アクティブなタブのために働いているということです。 表示されていないものの高さは何ですか？

Answer 1

他の人があなたに言ったようにあなたがかもしれない（ページ上のスペースを取って、それを避けるために、絶対にその位置を設定する追加のトリックで

visibility:hidden; 

：（隠しながら、オブジェクトはその寸法を維持可能）隠さへの可視性を設定することで、高さを得ることができます後でその位置属性を復元するために必要な時間の間だけこれを行う）

第2の方法は、絶対位置をいくらかの十分大きな座標に設定することによって、タブを見えるようにして、ページ外に移動させることです。

Answer 2

無効なタブがdisplay:noneに設定されているため、offsetHeightは役に立ちません。表示された後で、タブをアクティブにすると同時にMaxTabHeightルーチンを実行してみてください。私はそれがタブのクリックイベント内にあると仮定しています。

Answer 3

visibility：hidden（表示しない：none）を使用してみてください。私が思い出しているように、可視性要素の使用は隠されていますが、次元を保持しています。

Answer 4

ユーザビリティを考慮して、タブをCSSで非表示に設定しないでください。 （そこにはまだjsが無効になっている小さなパーセンテージがあります）。タブを通過して高さを読み取っている間に、最も高いタブを簡単に見つけることができます。そして、同時にあなたのサイトよりユーザーフレンドリー（行います。

をそして、あなたが崩壊する隠された細胞を使用しない場合、あなたはまた、上記のようなvisibility:hidden;を使用することができ