Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Cette fonction nécessite que chaque colonne ait les classes de taille pour toutes les tailles de fenêtre possible, soit « col-xs-* », « col-sm-* », « col-md-* », « col-lg-* ». Il faut également ajouter une classe « col-same-height » aux colonnes que l’on veut avoir de même hauteur.
$(window).load(function() {
$(window).resize(resizeColSameHeight);
resizeColSameHeight();
});
/**
* Redimensionnement hauteur des colonnes bootstrap "col-same-height" ligne par ligne selon la taille de la vue
*/
function resizeColSameHeight() {
if ($('.col-same-height').length > 0) {
var width = $('body').width();
if (width < 768)
var size = 'xs';
else if (width < 992)
var size = 'sm';
else if (width < 1200) var size = 'md'; else var size = 'lg'; var classnames = $('.col-same-height').first().attr("class").toString().split(' '); for(var i in classnames) { var classname = classnames[i]; if (classname.indexOf('col-' + size + '-') != -1) var nbCols = 12 / classname.replace('col-' + size + '-', ''); } $('.col-same-height').css('height', 'auto'); if (nbCols > 1) {
var i = 0;
do {
elems = $('.col-same-height').slice(i, i+nbCols);
var maxHeight = 0;
$(elems).each(function() {
if ($(this).height() > maxHeight)
maxHeight = $(this).height();
});
$(elems).each(function() {
$(this).css('height', maxHeight + 'px');
});
i += nbCols;
} while (elems.length > 0);
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.