Question

我目前在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的高度没有变化，也没有占用应该占用的空间。谁有人建议解决方案？任何帮助将不胜感激。

Answer 1

当您使用隐藏元素的visibility:hidden或display:none方式时，元素的高度和宽度不会更改，只是不可见。

编辑：我建议您为自己的特定操作使用自定义数据属性，并将其用于高宽使用。或者只是将您的计算结构略有不同并检查元素是否可见，这样就用0代替高度和宽度。

slideToggle隐藏高度不为零

1 个答案: