[JS] 크기 변화를 감지하는 두 가지 방법(resize, ResizeObserver)
🤔 화면 크기나 특정 요소의 크기가 변할 때, 그 변화를 감지할 수 있을까? 이번 시간에는 화면과 요소의 크기 변화를 감지하는 방법을 알아보았다. 1. resize, 브라우저 크기에 반응 1) resize 이벤트란? window.addEventListener("resize", function() { // window resize시 처리 }) resize 이벤트는 브라우저의 크기가 변경될 때 발생한다. 만약, 브라우저 크기 변화에 따른 dom의 변경 크기를 구하려면 getBoundingClientRect(), getComputedStyle()를 사용해줘야한다. 2) 예시 아래 예시는 브라우저 크기를 변경한 뒤, div의 변화된 너비를 화면에 출력했다. See the Pen resize example by ..
2022. 3. 26.