-
Javascript에서의 요소의 크기 구하기
var element = document.getElementById('content'); var h = element.clientHeight; var w = element.clientWidth;
높이
- clientHeight : padding을 포함한 높이
- scrollHeight : padding을 포함한 화면 상에 표시되지 않은 콘텐츠를 포함한 높이
- offsetHeight : border, padding, 스크롤 바를 포함한 높이
너비
- clientWidth : padding을 포함한 폭
- scrollWidth : padding을 포함한 화면 상에 표시되지 않은 콘텐츠를 포함한 폭
- offsetWidth : border, padding, 스크롤 바를 포함한 폭
윈도우 사이즈
- window.innerWidth : 스크롤 바를 포함하지 않는 창 너비
- window.innerHeight : 스크롤 바를 포함하지 않는 창 높이
- window.outerWidth : 스크롤 바를 포함, 창의 너비
- window.outerHeight : 스크롤 바를 포함한 창의 높이
Javascript에서의 요소의 크기 구하기
높이
- .height() : 요소 높이만
- .innerWidth() : 요소의 padding을 포함한 폭
- .outerWidth() : 요소의 border, padding을 포함한 폭
- .outerWidth(true) : 요소의 margin,border,padding을 포함한 폭
[참고사이트]
반응형'코딩스터디 > Javascript' 카테고리의 다른 글
자바스크립트 this, 호출, 객체 , 바인딩 뜻 (0) 2021.06.11 자바스크립트 동적속성 추가/제거 (0) 2021.06.11 다양한 DOM 생성방법, each문으로 반복 DOM생성 (0) 2021.06.10 자바스크립트 appendTo, prependTo 함수 (0) 2021.05.29 자바스크립트 타이머 함수 (0) 2021.05.29 댓글