0

私は現在、jQueryで#rightDescの高さを取得し、それを使用して#rightHistoryの高さを決定しています。どちらもdivです。

$('#rightHistory').height($('#rightMiddleCenter').innerHeight() - $('#rightDesc').outerHeight() - $('#rightDescToggle').outerHeight());

レイアウトは以下のとおりです。

<div id="rightMiddleCenter">
    <div id="rightDesc">
    </div>
    <div id="rightDescToggle">
        Toggle Descriptions
    </div>
    <div id="rightHistory">
    </div>
</div>

CSS：

#rightMiddleCenter{
float:left;
height:100%;
width:260px;
}
#rightDesc{
padding:0 0 10px;
}
#rightDescToggle{
padding:5px 5px 5px 0;
cursor:pointer;
}
#rightHistory{
}

ここで、slideToggleを使用して#rightDescを切り替え可能にすることにしましたが、非表示の場合でも、jQueryは完全な高さを返します。これにより、＃rightHistoryの高さが変更されず、必要なスペースを占有しなくなります。誰かが解決策を提案できますか？どんな助けでも大歓迎です。

4

1 に答える 1

1

visibility:hiddenまたは要素を非表示にする方法を使用するdisplay:noneと、要素の高さと幅は変更されず、表示されません。

編集:特定のアクションにカスタムデータ属性を使用し、それらを高さと幅の使用に使用することをお勧めします。または、少し異なる計算を作成し、要素が表示されているかどうかを確認して、高さと幅を 0 に置き換えます。

于 2012-05-05T22:15:49.163 に答える