Чтобы запускать код JavaScript каждый раз при изменении размера страницы, вы можете использовать различные методы. Вот несколько подходов:

1. Событие изменения размера окна: вы можете прослушивать событие resizeв объекте window. Это событие срабатывает всякий раз, когда изменяется размер окна браузера, включая изменения размера страницы. Вы можете подключить к этому событию прослушиватель событий и соответствующим образом выполнить свой код JavaScript.

Пример кода:

window.addEventListener('resize', function() {
  // Your code here
});

2. Медиа-запросы CSS. Еще один способ обнаружить изменения размера страницы — использовать медиа-запросы CSS в сочетании с JavaScript. Определите различные правила CSS на основе контрольных точек размера страницы и используйте JavaScript, чтобы проверить, когда эти правила применяются или изменяются.

Пример кода:

var mediaQuery = window.matchMedia('(max-width: 768px)');
function handleMediaQueryChange(event) {
  if (event.matches) {
    // Page size is smaller than 768px
    // Your code here
  } else {
    // Page size is larger than 768px
    // Your code here
  }
}
mediaQuery.addListener(handleMediaQueryChange);

3. API ResizeObserver: API ResizeObserver позволяет наблюдать за изменениями размера элемента. Вы можете создать новый экземпляр ResizeObserverи прикрепить его к элементу, который хотите отслеживать. Всякий раз, когда размер элемента изменяется, срабатывает функция обратного вызова наблюдателя.

Пример кода:

var element = document.getElementById('myElement');
var observer = new ResizeObserver(function(entries) {
  // Your code here
});
observer.observe(element);