javascript - 填充一组滑动切换中的可用空间

Question

我有 2 个 div，其内容使用 JQuery slidetoggle 来显示/隐藏，但我希望第二个占据屏幕的所有剩余垂直高度。

$('.heading').click(function (e) {
    $(e.target).parent().children('.content').slideToggle("fast", "swing");
});

jsFiddle 我开始了:http://jsfiddle.net/LMHgM/

知道如何在不借助 javascript 的情况下完成这项工作吗？希望这应该是浏览器大小调整和其他元素大小调整应该保持这个贪婪的 div 处于正确的状态。目前我唯一的解决方案是在 slidetoggle 和浏览器调整大小上触发我自己的调整大小方法以更正高度。

谢谢。

Answer 1

您应该为元素以及 body 和 html

指定高度为 100%

演示 http://jsfiddle.net/kevinPHPkevin/LMHgM/3/

body, html {
    height:100%;
}

#second {
    border: 1px dashed blue;
    height:100%;
}