Last active
January 16, 2017 21:45
-
-
Save jayllellis/e7904099345792491730 to your computer and use it in GitHub Desktop.
Simple jQuery equal height columns
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* @desc create equal height columns | |
* @param object - the elements to apply equal heights to | |
* @return none | |
*/ | |
jQuery.fn.equalHeights = function(){ | |
var colSelector = this.selector;// Get the selector of the object | |
var newHeight; | |
var colHeights = []; | |
$(colSelector).css('height', '');// Clear heights first | |
$(colSelector).each(function(){ | |
var singleCol = $(this).outerHeight();// Get the outerHeight of a single column | |
colHeights.push(singleCol);// Push the single height into the array | |
newHeight = Math.max.apply(Math,colHeights);// Get the tallest column from the array | |
}); | |
$(colSelector).css('height', newHeight+'px');// Apply the tallest height to all columns | |
} | |
//Usage: | |
$('#map-description .large-4 p').equalHeights(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment