Можно добавить функцию на событие изменения окна браузера. B внутри вызывать вашу функцию:
$( window ).resize(function() {
alignCenter();
});
Можно еще добавить небольшой таймаут на функцию, чтобы она не отрабатывала многократно при ресайзе, а с задержкой в 200 -300 милескунд. - будет меньше грузить браузер.
Но вообще, я бы посоветовал решить это с помощью css (нужно всегда стараться максимально использовать css+html для стилиации(ваш случай) и только в крайнем случае js).
Например, с использованием инлайн блоков и псевдоэлемента :
(источник
https://css-tricks.com/centering-in-the-unknown/)/* Родительский блок */
.block {
text-align: center;
white-space: nowrap;
}
/* Псевдоэлемент, который занимает всю высоту родителя. Относительно его центра будет выравниваться позиция выравниваемого элемента */
.block:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -0.25em; /* Adjusts for spacing */
}
/* Выравниваемый элемент с неопределенной шириной и высотой */
.centered {
display: inline-block;
vertical-align: middle;
width: 300px;
}
В той же статье можно найти и другие способы