Question

我正在使用以下的jquery来使我页面上的两个主要列高度相同。

var $toEqualize = $('.equalheightbox');
$toEqualize.css('height', (function(){
    return Math.max.apply(null, $toEqualize.map(function(){
        return $(this).height();
    }).get());
})());

哪个效果很好，除非div的内容不够大，无法伸展到页面底部，然后两列的高度相同，但页面底部有一个难看的间隙。我希望列的高度相同，但也要与用于显示页面的浏览器窗口一样高。

任何想法？

Answer 1

为什么不为这两个div添加容器，将它们设置为具有父级的完整高度并让它们增长。

Answer 2

未经测试但应该这样做：

var $toEqualize = $('.equalheightbox');
var wS = $(window).height();
$toEqualize.css('height', (function(){
    return Math.max.apply(null, $toEqualize.map(function(){
        return wS > $(this).height() ? wS : $(this).height();
    }).get());
})());

解释： $（window）.height（）是客户端屏幕的高度（如果你想要更少，请检查父级的高度。

wS＆gt; $（this）.height（）？ wS：$（this）.height（）//将至少选择屏幕的高度（此表达式是if（...）{...} else {...}的简写

jquery，列等于高度，至少与浏览器窗口一样高

2 个答案: