[Javascript] 브라우저 창 크기 확인하기 :: innerWidth, innerHeight, outerWidth, outerHeight

 

window

 

콘솔창에 window객체를 찍어보면 다양한 정보들이 찍히는데 여기에서

innerWidth, innerHeight / outerWidth, outerHeight에 대한 정보도 확인할 수 있다.

 

 

전체 창의 크기(보라색테두리)를 나타내는 outerHeight, outerWidth는

위 메뉴와 콘솔창을 포함한 전체 창의 크기를 나타낸다.

 

 

반면 실제 웹페이지가 보이는 크기(빨간색테두리)를 나타내는 innerHeight, innerWidth의 경우에는

콘솔창, 위 메뉴들을 제외하고 실제 보이는 웹페이지의 크기를 나타낸다.

 

 

outerWidth보다는 innerWidth를 활용해야하는 일들이 많을것으로 생각되니

innerWidth를 기억해두쟈~