Question

我正在尝试使用jQuery来均衡列的高度。我的解决方案在页面加载方面效果很好，但在窗口大小调整时没有。代码如下：

function equalizeCols(){
        var tallest = 0;
        var program = $("#programs li");
        var blueSpace = $("#programs li .programInfo");

        program.each(function(){
            var thisHeight = $(this).height();
            var imgHeight = $("#programs li img").height();
            var leftOver = thisHeight - imgHeight;

            if(leftOver > tallest){
                tallest = leftOver;
            }
        });
        blueSpace.height(tallest);
    }

$(window).load(equalizeCols);

简单地说，这会迭代所有列表项，获得最高的高度，然后将所有列表项设置为此高度。每个列表项都有一个百分比宽度，因此每个列表项的高度将根据窗口的大小而变化。也就是说，我需要这个来处理窗口调整大小。如果我只是$(window).resize(equalizeCols);，列表项将继续增长和增长，因为已经从加载设置了高度。

知道如何调整此代码以适应窗口大小调整吗？

Answer 1

$(window).resize(function() { 
    equalizeCols();
});

我不确定这种情况是否与您的代码不同。让我知道，我会尝试为您提供更好的解决方案。

在窗口上设置相等的高度列使用jQuery调整大小

1 个答案: