Skip to content

Instantly share code, notes, and snippets.

@chrK
Created March 10, 2013 14:52
Show Gist options
  • Save chrK/5128855 to your computer and use it in GitHub Desktop.
Save chrK/5128855 to your computer and use it in GitHub Desktop.
$(document).ready(function() {
function splitArrayInGroupsOf(jquery_object_array, group_size) {
var counter = 1,
group = [],
groups = [];
jquery_object_array.each(function() {
group.push($(this)[0]);
if (counter % group_size === 0) {
groups.push(group);
group = [];
}
counter++;
});
return groups;
}
function sameHeightFor(jquery_object_array) {
var jquery_objects_heights = [],
highest_jquery_object;
$(jquery_object_array).each(function() {
jquery_objects_heights.push($(this).height());
});
highest_jquery_object = Math.max.apply(null, jquery_objects_heights);
$(jquery_object_array).height(highest_jquery_object);
}
function sameHeightForColumnRowElements(selected_elements, column_number) {
// Reset elements to original height.
selected_elements.css('height', '');
if (column_number !== 1 ) {
var col_groups = splitArrayInGroupsOf(selected_elements, column_number);
for (var i = 0; i < col_groups.length; i++) {
sameHeightFor(col_groups[i]);
}
}
}
function getColumnNumber(viewport_width) {
var columns;
if (viewport_width > 960) {
columns = 3;
}
else if (viewport_width <= 960 && viewport_width >= 640 ) {
columns = 2;
}
else {
columns = 1;
}
return columns;
}
var viewport_width = $(window).width(),
column_number = getColumnNumber(viewport_width),
column_elements = $('.js-column-row-element');
// Init
sameHeightForColumnRowElements(column_elements, column_number);
// Control on Window Resize
$(window).resize(function() {
var new_column_number = getColumnNumber($(window).width());
if (new_column_number !== column_number) {
column_number = new_column_number;
sameHeightForColumnRowElements(column_elements, column_number);
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment