[Window_Object] JS - innerWidth 속성 ★ - 윈도우 내용영역 너비(= 내용너비 = 내부너비 = innerWidth속성 = 이너위드스속성) (IE9 이상)

1. innerWidth 예제 - 윈도우 내용영역 너비 반환
2. innerWidth 정의
3. innerWidth 구문
4. innerWidth 예제 - 해상도 너비로 모바일 여부 체크

innerWidth 예제 - 윈도우 내용영역 너비 반환

 

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>

function homzzang() {

  var w = window.innerWidth;

  var h = window.innerHeight;

  var res = "Width: " + w + "<br>Height: " + h;

  document.getElementById("demo").innerHTML = res;

}

</script>

 

결과보기

innerWidth 정의

 

윈도우 콘텐츠 (= 내용) 영역의 너비를 px 단위로 반환. 

 

---

 

1.

• 수직스크롤바 존재 시, 포함 O.
• 읽기 전용 속성.
• 기본값 존재 X

2.

IE9 이상 모든 브라우저 지원.

 

3. MDN innerWidth 매뉴얼

https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth

 

innerWidth 구문

 

window.innerWidth

또는,

innerWidth

 

---

[반환값]

 

윈도우 콘텐츠 영역 너비를 px 단위로 잰 숫자 반환. (예: 640)

 

innerWidth 예제 - 해상도 너비로 모바일 여부 체크

 

function is_mobile() {

    return ( window.innerWidth <= 640 );

}