Skip to content

Instantly share code, notes, and snippets.

@tvaliasek
Created February 13, 2015 14:47
Show Gist options
  • Save tvaliasek/89ea74071bf132f50e7c to your computer and use it in GitHub Desktop.
Save tvaliasek/89ea74071bf132f50e7c to your computer and use it in GitHub Desktop.
jQuery fix for same height items in row
/*
* example of html structure:
*
* <div class="row row-same-height">
* <div class="col-sm-6 col-xs-12">
* <div class="same-height-item">...</div>
* </div>
* <div class="col-sm-6 col-xs-12">
* <div class="same-height-item">...</div>
* </div>
* </div>
*/
jQuery(function(){
var $fixTimeout;
$(window).resize(function(){
clearTimeout($fixTimeout);
$fixTimeout = setTimeout(changeElsMinHeight(), 170);
});
function changeElsMinHeight(){
var $rows = $('.row-same-height');
$rows.each(function(){
var $els = $(this).find('.same-height-item');
var $minHeight = 0;
$els.css('min-height', $minHeight+'px');
$els.each(function(){
if($(this).outerHeight(false)>$minHeight){
$minHeight = $(this).outerHeight(false);
}
});
$minHeight+=12;
$els.css('min-height', $minHeight+'px');
});
}
changeElsMinHeight();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment