ResizeObserver

DOM要素の大きさの変更を監視するDOM API

ResizeObserver - Web API | MDN

実験的な機能とされているが、だいたいのbrowserで実装されている

例

javascript

const observer = new ResizeObserver(entries => {

for(const {contentRect} of entries) {

console.log(contentRect);

}

});

observer.observe(document.getElementsByClassName("cursor")[0]);

位置も返してくれるが、位置の変更は検知してくれないようだ

型定義ファイル

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/resize-observer-browser/index.d.ts

References

要素のサイズ変化を監視するResizeObserver - EagleLand

ResizeObserver API を使って要素のリサイズを検知する

#2021-11-06 13:44:02