Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
equalRowHeights
/**
* jQuery equalRowHeights plugin.
*
* This is a small plugin that handles equalHeights in a reponsive
* way, meaning that it handles rows as well.
*
* Code from http://codepen.io/micahgodbolt/pen/FgqLc
*
*/
(function($) {
$.fn.equalRowHeights = function() {
var currentTallest = 0,
currentRowStart = 0,
rowDivs = new Array(),
$el,
topPosition = 0,
container = $(this);
$(container).each(function() {
$el = $(this);
$($el).height('auto');
topPostion = $el.position().top;
if (currentRowStart != topPostion) {
for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) {
rowDivs[currentDiv].height(currentTallest);
}
rowDivs.length = 0; // empty the array
currentRowStart = topPostion;
currentTallest = $el.height();
rowDivs.push($el);
} else {
rowDivs.push($el);
currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest);
}
for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) {
rowDivs[currentDiv].height(currentTallest);
}
});
};
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment