syannu
4/26/2017 - 1:54 AM

ブロック要素の高さ揃え

box-sizing使える場合(IE8〜)height() → outerHeight() 同じclass名が同ページ内に複数あると上手く動作しない

// 子要素一括
function setHeightChild(elm) {
	var $elm = $(elm);

	if ($elm.length) {
		$elm.each(function() {
			var rep = 0;

			$(this).children().each(function() {
				var elmHeight = parseInt($(this).height());

				$(this).css('height', 'auto');
				if (elmHeight > rep) {
					rep = elmHeight;
				}
			});
			$(this).children().css({height:(rep)});
		});	
	}
}
setHeightChild('.modBoxRelatedSupport');

// 要素と列数指定
function setHeightRows(elm, num) {
	var $elm = $(elm);

	if ($elm.length) {
		$elm.each(function(i) {
			var elmHeight;
			var $self = $(this);

			if (i === 0 || i % num === 0) {
				elmHeight = $self.height();

				for (var n = i + 1; n <= i + num - 1; n++) {
					if (elmHeight < $elm.eq(n).height()) {
						elmHeight = $elm.eq(n).height();
					}
				}
				for (var l = i; l <= i + num - 1; l++) {
					$elm.eq(l).css('height', elmHeight);
				}
			}
		});
	}
}
setHeightRows('.modBoxRelatedSupport .innerRelated', 2);