Как изменить отображение страницы без перезагрузки?

Question

[Barring]

За отвратный пример кода заранее извиняюсь. Я с jquery / js особо не сталкивался, но в данной ситуации для желаемого результата одними возможностями css видимо справиться проблематично.
Суть работы этого кода :

var mh = 0;
			$(".header_h").each(function () {
				var h_block = ($(this).height());
				if(h_block > mh) {	
					{mh = h_block;
						$(".header_h").height(mh);
					}
				};
			});

заключается в следующем : Если какой-то из элементов с указанным классом изменяет свою высоту на большую - все остальные элементы с этим же классом тоже должны изменять свою высоту. Но проблема заключается в том, что это изменение происходит лишь после перезагрузки страницы, как это можно исправить?

Демонстрация происходящего : video / site

Comments

[Dima Polos]

Из-за чего меняется высота?

[Barring]

Dima Polos, при уменьшении ширины блока, текст смещается вниз, в следствии этого и высота блока тоже увеличивается.

[Dima Polos]

Barring, а ширина блока меняется если меняется ширина окна браузера?

Answer 1

[y0u]

Зачем писать свой велосипед, когда уже есть хороший плагин:
https://github.com/liabru/jquery-match-height

Answer 2

[Dima Polos]

Есть вариант, не очень по производительности, это вот:

$(window).on('resize', function(e){
 // тут ваш код
}

Comments

[Barring]

Здесь всё же по итогу проблема находится в том, что код, используемый мною, видимо не является верным. Ибо, без воздействия js - при смещении текста в отладчике изменяется высота блока с текстом (только одного). А при работе js - до обновления страницы никаких изменений не происходит.

Answer 3

[sverhvova]

а для чего указывать явную высоту для заголовка?

Comments

[Barring]

Мне необходимо что бы высота всех блоков одного класса была одинакова. И если из-за сноса текста изменяется высота какого-то блока - для всех остальных задаётся эта самая высота.