Запустить функцию после ресайза окна

Question

Вот функция

function getCardParams() {
    innerWrappHeightArr = [];
    $(".bc_card").css({
        "height" : "auto"
    });
    $(".bc_card").each(function() {
        innerWrapp = $(this).find(".inner_content");
        innerWrappHeight = $(this).height();
        innerWrappHeightArr.push(innerWrappHeight);
    });
    maxHeight = Math.max.apply(null, innerWrappHeightArr);
    $(".bc_card").css({
        "height" : maxHeight + "px"
    });
}

Как ее запустить только после того как закончился ресайз окна браузера? Нужно вычислить наибольшую высоту контента из всех карточек.

Answer 1

Добавьте этот код в свой проект

window.addEventListener('resize', getCardParams);

Чтобы запустить функцию по окончанию изменения размера, то вам нужно использовать таймер. В DOM нет метода позволяющего отслеживать окончание изменения размера экрана.

Вот код работающий на таймере:

function debounce(func){
  var timer;
  return function(event){
    if(timer) clearTimeout(timer);
    timer = setTimeout(func,100,event);
  };
}

window.addEventListener('resize', debounce(getCardParams));

БЛОГ НА HUSL

Запустить функцию после ресайза окна

Ответы (1 шт):