Skip to content

Instantly share code, notes, and snippets.

@orioltf
Last active August 29, 2015 14:21
Show Gist options
  • Save orioltf/db41190108b031149660 to your computer and use it in GitHub Desktop.
Save orioltf/db41190108b031149660 to your computer and use it in GitHub Desktop.
#JQUERY #UTIL equalizeHeights
/**
* Set the height from every jQuery element to the highest of the elements.
* @returns {object} the jquery objects passed in with the new height.
*/
$.fn.equalizeHeights = function() {
var maxHeight = 0,
itemHeight = 0;
this.each(function(index, element) {
var $element = $(element);
itemHeight = parseInt($element.outerHeight());
maxHeight = itemHeight > maxHeight ? itemHeight : maxHeight;
});
return this.css({'height':maxHeight});
};
/**
* Method that calculates max height and applies styles
* @method
* @private
*/
Plugin.prototype._setHeights = function() {
this.$list = $('ul.cards');
this.$items = this.$element.find('li');
// OrT: IE9 floating point forces rounds down, so it makes to have 1 less element per column.
var perRow = Math.round(this.$list.width() / this.$items.width());
this.$items.css('height', 'auto');
// exit there are no columns
if (typeof perRow === 'number' && perRow && perRow > 1) {
for(var i = 0, j = this.$items.length; i < j; i += perRow) {
var $row = this.$items.slice(i, i + perRow);
$row.equalizeHeights();
}
}
};
$('.my_list').hide().find('li').equalizeHeights().end().show();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment