Created
February 7, 2014 18:10
-
-
Save jmcclellan/8868368 to your computer and use it in GitHub Desktop.
Use jQuery to create equal height columns
This file contains hidden or 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
function setEqualHeight(columns) { | |
// define our variables | |
var tallestcolumn = 0; | |
var currentHeight = 0; | |
// .each() iterates over a jquery object (in this case our columns argument) | |
columns.each( | |
function() { | |
// assign currentHeight variable the height of the current DOM element in our loop | |
currentHeight = jQuery(this).height(); | |
// is the currentHeight variable larger than the currentHeight variable? | |
if(currentHeight > tallestcolumn) { | |
// if it is then assign its height to the currentHeight variable | |
tallestcolumn = currentHeight; | |
} | |
} | |
); | |
// finally, take the value of the currentHeight variable and assign it to all the columns we iterated over | |
columns.height(tallestcolumn); | |
} | |
jQuery(document).ready(function($) { | |
// call our setEqualHeight function on the .featured-posts .information .holder DOM objects | |
setEqualHeight($(".featured-posts .information .holder")); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment