[jQuery] .width() .height()

See the Pen [jQuery] .width() .height() by mill (@millfeel) on CodePen.

 

.width()와 .height()는 각각 특정 요소의 넓이와 높이 값을 구하는 구문이다.

또한, 해당 구문을 통해 기존 요소의 넓이 값을 변경할 수 있다.

[주의] 이 값은 순수 컨텐츠의 가로/세로 값이다.

// 넓이 값과 높이 값 구하기
$('선택자').width();
$('선택자').height();


// 넓이 값과 높이 값 변경하기
$('선택자').width('변경할 수치');
$('선택자').height('변경할 수치');

[속성 종류]

$('선택자').height() : 내부높이
$('선택자').innerHeight() : 내부높이 + padding
$('선택자').outerHeight() : 내부높이 + padding + border
$('선택자').outerHeight(true) : 내부높이 + padding + border + margin

*height를 width로 변경하면 width속성이 된다.

---

[공부좌표]

jquery로 높이(height)와 넓이(width)를 측정하는 모든 방법

인터랙티브 웹디자인북 p138