Комментарии 9
А что мешает привязать отслеживание размеров элемента к тем действиям, которые приводят к изменению его размеров? С window понятно, там действия внешние, но элементы сами по себе не меняются в размере.
В статье речь как раз и идет о том, чтобы отслеживать действия которые приводят к изменению размеров элемента.
Тут приводится лишь 2 дополнительных способа. Если вы точно знаете когда размеры элемента могут измениться, то вы можете отслеживать это другим способом.
Например если вы делаете плагин слайдера, то можно проверять высоту при переключении слайдов.
Но если пользователь вашего плагина поместит на слайд какой-нибудь опрос, в котором при нажатии на кнопку будут раскрываться результаты (и соответственно изменяться высота контента), то ему надо будет еще раз вручную инициировать пересчет высоты слайдера.
Тут приводится лишь 2 дополнительных способа. Если вы точно знаете когда размеры элемента могут измениться, то вы можете отслеживать это другим способом.
Например если вы делаете плагин слайдера, то можно проверять высоту при переключении слайдов.
Но если пользователь вашего плагина поместит на слайд какой-нибудь опрос, в котором при нажатии на кнопку будут раскрываться результаты (и соответственно изменяться высота контента), то ему надо будет еще раз вручную инициировать пересчет высоты слайдера.
Ещё надо было упомянуть про ResizeObserver (скоро появится, а пока полифилы)
Про ResizeObserver не знал. Спасибо — добавлю.
Бегло просмотрел полифиллы. Один из них работает по принципу добавления фрейма, а все остальные через setTimeout или requestAnimationFrame (для которого, кстати, тоже подключается полифилл с setTimeout).
Значит будем ждать ResizeObserver, хотя врядли он появится скоро, так как находится в стадии Editors Draft.
И еще в ResizeObserver есть одно «но» — сейчас в спецификации есть такая строчка:
Бегло просмотрел полифиллы. Один из них работает по принципу добавления фрейма, а все остальные через setTimeout или requestAnimationFrame (для которого, кстати, тоже подключается полифилл с setTimeout).
Значит будем ждать ResizeObserver, хотя врядли он появится скоро, так как находится в стадии Editors Draft.
И еще в ResizeObserver есть одно «но» — сейчас в спецификации есть такая строчка:
observations will not be triggered by CSS transforms
Ну, посмотрим, что будет к релизу, а так, уже давно есть https://github.com/wnr/element-resize-detector
DOMSubtreeModified числится как deprecated
https://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMSubtreeModified
https://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMSubtreeModified
Добавил в ваш пример textarea с возможностью изменения размеров. Работает, но с сильными рывками. Похоже, виноват transition-duration: 1ms;
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Отслеживаем ресайзинг элемента без setTimeout и фреймов