jQuery将元素的高度设置为组中最高的 [英] jQuery Set Height of Element to Highest in the group

问题描述

我正在尝试使用jQuery从div中的前3个元素中找到最高元素然后将所有3个相同的高度设置然后检查接下来的3并设置它们等等。如果我的窗口宽度== X，如果窗口宽度<1，则也是如此。 X然后找到最高的2个元素然后设置它们，然后是接下来的2个然后是接下来的2个等等。

I'm trying to work with jQuery to find the highest element from the first 3 elements within a div then set all 3 the same height then check the next 3 and set them.. etc.. if my window width == X, also if the window width is < X then find the highest 2 elements then set them, then the next 2 then the next 2 etc.

这是我当前的代码，适用于所有元素，我会就像要浏览组中的元素（2和3）并根据结果和窗口大小设置该组的高度。

This is my current code which works for all the elements, I would just like to to go through the elements in groups (2's and 3's) and set the height for that group based on the result and window size.

// Find highest element and set all the elements to this height.
    $(document).ready(function () {

    // Set options
    var height = 0;
    var element_search = "#cat_product_list #cat_list";
    var element_set = "#cat_product_list  #cat_list";

    // Search through the elements set and see which is the highest.
    $(element_search).each(function () {
        if (height < $(this).height()) height = $(this).height();
        //debug_(height,1);
    });

    // Set the height for the element(s if more than one).
    $(element_set).each(function () {
        $(element_set).css("height", (height+40) + "px");
    });
});

非常感谢任何帮助：）

推荐答案

我现在整理了这个，
查看我的小提琴：

I've sorted this now, Check out my Fiddle:

http://jsfiddle.net/rhope/zCdnV/

// Find highest element and set all the elements to this height.
$(document).ready(function () {

// If you windows width is less than this then do the following
var windowWidth = $(window).width();
if (windowWidth < 2000) {
    var i = 0, 
        quotes = $("div#cat_product_list").children(),
        group;

    while ((group = quotes.slice(i, i += 2)).length) {
        group.wrapAll('<div class="productWrap"></div>');
    }
}

// Find the width of the window
var windowwidth = $(window).width();
//debug_(windowwidth);

// Set options
var height = 0;
var element_wrap = ".productWrap";
var element_search = ".cat_list";

// Search through the elements set and see which is the highest.
$(element_wrap).each(function () {
    $(this).find(element_search).each(function () {
        if (height < $(this).height()) height = $(this).height();
    });

    //alert("Block Height: " +height);

    // Set the height for the element wrap.
    $(this).css("height", (height) + "px");

    // Unset height
    height = 0;
});

});

这篇关于jQuery将元素的高度设置为组中最高的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！