仅使用 jQuery 的 CSS3 Vertical box flex

Question

我如何用 jQuery 做到这一点：http://jsfiddle.net/tdskate/C4nAG/

我需要一个 div 来自动调整高度以适应剩余多少可用垂直空间。

我尝试使用$('body > *').height() 计算它，然后从中减去元素的高度...但是当某些元素具有顶部或底部边距时，它无法正确计算。

另外，当浏览器窗口调整大小时，它需要调整大小...

Answer 1

这应该可行：

$(function() {
    $(window).resize(function() {
        var other_element_heights = 0;

        $('body').children().each(function() {
            other_element_heights += $(this).outerHeight(true);
        });

        other_element_heights -= $('.auto-height').height();

        $('.auto-height').height($(window).height() - other_element_heights);
    }).resize();   
});

http://jsfiddle.net/C4nAG/82/