Question

我有一个jquery实现在最高的列上有equalHeight，但在这种情况下我不希望列与最高的列匹配。这个想法是让col2和col3匹配col1的高度。我有一个溢出：自动应用于所有列，因此会出现一个滚动条。

参见demo，但是这个equalHeight匹配最高的列，但我想反过来发生 http://jsfiddle.net/L7JvD/2/

   $.fn.equalHeightify = function() {
        var highest = 0; // keep track of the greatest height
        $(this).each(function() { // for each element
            if ($(this).height() > highest) { // compare heights
                highest = $(this).height();
            }
        });
        $(this).height(highest); // set new height
    }

    $(document).ready(function() {
        $('.column').equalHeightify();
    });

Answer 1

编辑：根据更新后的问题，以下内容更符合您的需求。

$.fn.equalHeightify = function(ColNumber) {
    var targetCol = ColNumber - 1; // Substracing one because .each() uses a zero-based index, so Column 1 = index 0, etc.
    var targetHeight = $(this).eq(targetCol).height(); // grab the target item's height
    $(this).each(function(index) { // for each element
        if (index != targetCol) // find all items besides the target column and set their height to the target column's height
            $(this).height(targetHeight);
    });
}

$(document).ready(function() {
    $('.column').equalHeightify(2);
});

此修订版本允许您指定要用作目标的列号，以反映所有其他列的大小。要在jsFiddle中进行测试，请将equalHeightify()来电中的号码更改为您想要的号码。

更新了jsFiddle：http://jsfiddle.net/5N42p/4/

<击> 很简单;更改逻辑以设置初始最低值，然后将所有后续列高度与之比较 - 每当找到新的较低值时，将值重置为其高度：

$.fn.equalHeightify = function () { var lowest; // keep track of the lowest height $(this).each(function (index) { // for each element if (index == 0) // set the height of the first item as our initial "lowest" lowest = $(this).height(); else if ($(this).height() < lowest) // compare all other's heights to "lowest" and reset "lowest" if a shorter is found lowest = $(this).height(); }); $(this).height(lowest); // set new height }

~~jsFiddle：http://jsfiddle.net/e9v3n/2/~~

最短列jquery上的equalHeight

1 个答案: