jquery - régler la hauteur à tous les 2 ou 3 éléments

Question

J'ai plusieurs divs sur une page en colonnes de 2, donc tous les 2 divs doivent avoir la même hauteur. Autant que je puisse dire que les plugins disponibles pour forcer la même hauteur font tous les éléments de la même hauteur, j'ai juste besoin que chaque paire ait la même hauteur.

mon code ressemble à ceci

etc

je l'jquery suivante qui fonctionne, mais je suis sûr que cela peut être fait plus facile

{ 
    var rowOneHeight = Math.max($('div.large:eq(0)').height(),$('div.large:eq(1)').height()); 
    $('div.large:eq(0)').css('min-height', rowOneHeight); 
    $('div.large:eq(1)').css('min-height', rowOneHeight); 

    var rowTwoHeight = Math.max($('div.large:eq(2)').height(),$('div.large:eq(3)').height()); 
    $('div.large:eq(2)').css('min-height', rowTwoHeight); 
    $('div.large:eq(3)').css('min-height', rowTwoHeight); 

    var rowThreeHeight = Math.max($('div.large:eq(4)').height(),$('div.large:eq(5)').height()); 
    $('div.large:eq(4)').css('min-height', rowThreeHeight); 
    $('div.large:eq(5)').css('min-height', rowThreeHeight); 

}

il aurait également besoin de la même chose à faire avec un groupe de thr ee divs. Merci

Answer 1

Vous pouvez faire une boucle avec .slice() à boucle à travers dans des ensembles de deux, comme ceci:

var elems = $("div.large"); 
for(var i = 0; i < elems.length; i+=2) { 
    var divs = elems.slice(i, i+2), 
     height = Math.max(divs.eq(0).height(), divs.eq(1).height()); 
    divs.css('min-height', height); 
} 

---

Ou, pour une approche plus générale, puisque vous voulez le faire avec 3 ainsi, voici une forme de plugin:

$.fn.setMinHeight = function(setCount) { 
    for(var i = 0; i < this.length; i+=setCount) { 
    var curSet = this.slice(i, i+setCount), 
     height = 0; 
    curSet.each(function() { height = Math.max(height, $(this).height()); }) 
      .css('min-height', height); 
    } 
    return this; 
}; 

Ensuite, vous pouvez l'appeler comme ceci:

$("div.large").setMinHeight(2); //or 3, etc 

You can test it out here.