Множественные селекторы одинаковой высоты ⇐ Jquery

[Гость]

Я нашел на Codepen следующий скрипт и адаптировал его для проекта, над которым работаю: https://codepen.io/RogerHN/pen/YNrpVa

Я по сути изменил селектор:

var matchHeight = function () { функция инициализации() { Слушатели событий(); matchHeight(); } функция eventListeners(){ $(window).on('resize', function() { matchHeight(); }); } функция matchHeight(){ var groupName = $('#services h3'); вар groupHeights = []; groupName.css('минимальная высота', 'авто'); groupName.each(function() { groupHeights.push($(this).outerHeight()); }); вар maxHeight = Math.max.apply(null, groupHeights); groupName.css('min-height', maxHeight); }; возвращаться { инициализация: инициализация }; } (); $(документ).ready(функция() { matchHeight.init(); }); Я видел множество скриптов одинаковой высоты, но многие из них не работают, когда я изменяю размер экрана с маленького размера окна на большой. Этот скрипт работает, но когда я добавляю несколько селекторов, он не работает должным образом.

Я попробовал var groupName = $('#services h3, #services .info');, который работает, но делает все h3 и все .info одинаковой высоты. Итак, если самый высокий h3 имеет размер 100 пикселей, а самый большой .info — 500 пикселей, все h3 и .info станут 500 пикселей. Мне бы хотелось, чтобы все h3 стали 100 пикселей (поскольку это самый большой h3), а все .info стали 500 пикселей (поскольку это самый большой .info).

Я не знаю, как это объяснить. Но это означает захват всех селекторов и рассмотрение их всех как одного выбора, а не сохранение двух селекторов отдельно и просто применение сценария внутри конкретного селектора, как я и предполагал.

ОБНОВЛЕНИЕ: я нашел еще один фрагмент кода, он делает все при изменении размера, но не запускается при загрузке страницы. Я пытался добавить document.ready, но это сломало мой window.onresize

functionqualHeight(group) { вар самый высокий = 0; group.each(function() { вар thisHeight = $(this).height(); if(thisHeight > самый высокий) { самый высокий = thisHeight; } }); group.height(самый высокий); } функция измененного размера () { EqualHeight($("#services h3")); EqualHeight($("#services .info")); } вар доит; window.onresize = функция(){ ClearTimeout (сделать); doit = ​​setTimeout (resizedw, 100); }; Любая помощь приветствуется.

Спасибо,
Джош