본문 바로가기
프로그래밍/JavaScript

JavaScript 스크린 객체

by zoo10 2013. 1. 5.

JavaScript Window Screen


window.screen object 는 사용자 화면에 대한 정보를 포함하고 있다.


Window Screen

window.screen 객체는 window 를 붙이지 않고 사용할 수 있다. 아래 예제처럼 사용이 가능하다는 얘기이다.


  • screen.availWidth - 가용한 스크린 넓이 (해상도 넓이) available screen width
  • screen.availHeight - 가용한 스크린 높이 (해상도 높이) available screen height


윈도우 스크린 해상도의 넓이 Window Screen Available Width

screen.availWidth 속성은 Windows의 태스크바(작업표시줄) 영역을 뺀 해상도의 넓이 정보를 픽셀 단위로 넘겨 줍니다.

Example

<script>

document.write("Available Width: " + screen.availWidth);
</script>

위 코드의 결과는 (사용자의 해상도에 따라 달라진다.):

Available Width: 1280

Try it yourself »


윈도우 스크린 해상도의 높이 Window Screen Available Height

screen.availHeight 속성은 Windows의 태스크바(작업표시줄) 영역을 뺀 해상도의 높이 정보를 픽셀 단위로 넘겨 줍니다.

Example

<script>

document.write("Available Height: " + screen.availHeight);
</script>

위 코드의 결과는 (사용자의 해상도에 따라 달라진다.):

Available Height: 770

더 많은 정보를 얻을 수 있는 스크립트 예제
<!DOCTYPE html>
<html>
<body>

<h3>Your Screen:</h3>

<script>
document.write("Total width/height: ");
document.write(screen.width + "*" + screen.height);
document.write("<br>");
document.write("Available width/height: ");
document.write(screen.availWidth + "*" + screen.availHeight);
document.write("<br>");
document.write("Color depth: ");
document.write(screen.colorDepth);
document.write("<br>");
document.write("Color resolution: ");
document.write(screen.pixelDepth);
</script>

</body>
</html>

Screen Object Properties

PropertyDescription
availHeightscreen 높이 반환 (Windows Taskbar 제외)
availWidthscreen 넓이 반환 (Windows Taskbar 제외)
colorDepth색품질 반환 (아주높음 32bit)
heightscreen 전체 높이 반환
pixelDepth색품질 반환 (아주높음 32bit)
widthscreen 전체 넓이 반환

'프로그래밍 > JavaScript' 카테고리의 다른 글

JavaScript Date 객체  (2) 2013.01.05
JavaScript 배열 객체, Array  (2) 2013.01.05
JavaScript History 객체  (0) 2013.01.05
JavaScript Location 객체  (0) 2013.01.05
JavaScript Navigator 객체  (0) 2013.01.05
JavaScript 브라우저 객체 모델 BOM  (2) 2013.01.05
JavaScript 수학 객체 Math  (0) 2013.01.05
JavaScript 논리 객체, boolean  (0) 2013.01.05