нужно реализовать адаптив через javascript, а у меня получается только после обновления страницы

Question

let block = 100

if(window.innerWidth <= 767){
  block = 100
} else{
  block = 75
}

Answer 1

Создаете функцию, допустим:

function calcBlock() {
  const widthWindow = window.innerWidth
  const block = widthWindow <= 767 ? 100 : 75
  console.log('Текущее значение window.innerWidth=', widthWindow, ' block=', block)
  return block
}

Добавляете ее в обработчик, используя addEventListener:

window.addEventListener('resize', calcBlock)

Пример (изменяйте размеры окна браузера, чтобы видеть как происходит срабатывание обработчика на событие resize)

function calcBlock() {
  const widthWindow = window.innerWidth
  const block = widthWindow <= 767 ? 100 : 75
  console.log('Текущее значение window.innerWidth=', widthWindow, ' block=', block)
  return block
}


window.addEventListener('resize', calcBlock)
calcBlock()
console.log('Изменяйте размеры окна, чтобы увидеть событие resize в действии')

БЛОГ НА HUSL

нужно реализовать адаптив через javascript, а у меня получается только после обновления страницы

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