JavaScript

[BOM] JS - Window Screen 객체 - 화면객체 (= 스크린객체 = screen객체)

Window Screen 객체

 

1.  

window.screen 객체는 사용자 화면에 대한 정보 포함.

 

2.

window.screen객체는 window 접두사없이 작성 가능.

 

screen.width - 화면너비

screen.height - 화면높이

screen.availWidth - 사용가능화면너비

screen.availHeight - 사용가능화면높이

screen.colorDepth - 색상심도

screen.pixelDepth - 픽셀심도

 

 

 

window.screen.width - 화면너비 (픽셀단위)

 

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


<script>

document.getElementById("demo").innerHTML = 

"화면너비:  " + screen.width;

</script>

 

결과보기 (예) 1280

 

 

window.screen.height - 화면높이 (픽셀단위)

 

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


<script>

document.getElementById("demo").innerHTML = 

"화면높이:  " + screen.height;

</script> 

 

결과보기 (예) 720

 

 

window.screen.availWidth - 사용가능화면너비

 

방문자 화면너비를 픽셀 단위로 Windows 작업표시줄과 같은 인터페이스 기능을 뺀 값으로 반환.

 


 

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


<script>

document.getElementById("demo").innerHTML = 

"사용가능 화면너비:  " + screen.availWidth;

</script>

 

결과보기: (예) 1280

 

 

window.screen.availHeight - 사용가능화면높이

 

방문자 화면높이를 픽셀 단위로 Windows 작업표시줄과 같은 인터페이스 기능을 뺀 값으로 반환.

 


 

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


<script>

document.getElementById("demo").innerHTML = 

"사용가능 화면높이:  " + screen.availHeight;

</script>

 

결과보기: (예) 680

 

 

window.screen.colorDepth - 화면색상심도

 

한 색상을 표시하는 데 사용되는 비트 수 반환.

 


 

1.

모든 최신 컴퓨터는 색 해상도에 24 비트 또는 32 비트 하드웨어 사용.

24 비트 = 16,777,216 개의 다른 "True Colors (트루 컬러)"

32 비트 = 4,294,967,296 개의 다른 "Deep Colors(딥 컬러)"

 

2.

오래된 컴퓨터는 16 비트 사용. 65,536 개의 다른 "High Colors (하이 컬러)"해상도.

아주 오래된 컴퓨터와 오래된 휴대폰은 256 비트의 "VGA Color"인 8 비트 사용.

 

3.

HTML에 사용된 #rrggbb (rgb) 값은 "트루 컬러" 의미. (16,777,216 개의 다른 색상).

 

4.

최신 컴퓨터의 경우, colorDepth (색상심도)와 colorDepth (픽셀심도)가 동일.

 


 

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


<script>

document.getElementById("demo").innerHTML = 

"화면색상심도 : " + screen.colorDepth;

</script>

 

결과보기 (예) 24


 

window.screen.pixelDepth - 화면픽셀심도

 

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


<script>

document.getElementById("demo").innerHTML = 

"화면픽셀심도: " + screen.pixelDepth;

</script> 

 

결과보기: (예) 24 

※ 최신 컴퓨터의 경우, colorDepth (색상심도)와 colorDepth (픽셀심도)가 동일.

 

방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Basic JS - Home (JS입문) + Javascript Framework (프레임워크) 종류
Basic JS - Intro (JS소개)
Basic JS - Where To (JS위치) - JS구문 / JS코드위치 / JS사용법 ※ JS외부링크 주의사항
Basic JS - Output (JS출력= JS쓰기) ★★★★★ document.write() = 다큐먼트라이트
Basic JS - Syntax (JS구문) ★
Basic JS - Statement (JS구문= JS명령문)
Basic JS - Comment (JS주석)
Basic JS - Variable (JS변수) ★★★★★
Basic JS - Operator (연산자) - JS연산자 ★★★★★
Basic JS - Data Type - 데이터유형 ★★★★★ (= 데이터형식 = 데이터타입 = 데이터종류 = 자료형…
Basic JS - Function - JS함수 ★★★★★ ※ 일반함수 특징 2
Basic JS - Object - JS객체 ★★★★★
Basic JS - Scope - JS유효범위 (= JS접근범위 = 변수 종류) ★★★★★★★★★★
Basic JS - Event - JS이벤트 (= JS코드실행방법) ★★★★★
Basic JS - Strings - JS문자열
1/89
목록
  • 채팅방
  • 필독
1. 채팅창 헤드에서 접속자 확인 2. 닉네임 클릭해 1:1 채팅 가능 3. 닉네임 클릭해 귓속말 가능 4. 닉네임 클릭해 호출하기 가능 5. 우하단 클릭해 환경 설정 가능 6. 의뢰글 작성 후 의뢰 상담 가능 7. 질문글 작성 후 질문 상담 가능 8. 채팅방에 개인정보 입력 금지 9. 채팅방에 광고 욕설 비방 금지
 홈  PC버전 로그인 일본어
웹디자인언어
서버관리언어
고급코딩언어
그누보드 1
제작의뢰
Q&A
커뮤니티 1
웹유틸
회원센터
홈짱닷컴 PC버전 로그인