JS Screen

The window.screen object contains information about the user's screen.

Window Screen

The window.screen object can be written without the window prefix.

Properties:

• screen.width
• screen.height
• screen.availWidth
• screen.availHeight
• screen.colorDepth
• screen.pixelDepth

Window Screen Width

The screen.width property returns the width of the visitor's screen in pixels.

Example

 document.getElementById("demo").innerHTML =
"Screen Width: " + screen.width;

Window Screen Height

The screen.height property returns the height of the visitor's screen in pixels.

Example

 document.getElementById("demo").innerHTML =
"Screen Height: " + screen.height;

Window Screen Available Width

The screen.availWidth property returns the width of the visitor's screen, in pixels, minus interface features like the Windows Taskbar.

Example

 document.getElementById("demo").innerHTML =
"Available Screen Width: " + screen.availWidth;

Window Screen Available Height

The screen.availHeight property returns the height of the visitor's screen, in pixels, minus interface features like the Windows Taskbar.

Example

 document.getElementById("demo").innerHTML =
"Available Screen Height: " + screen.availHeight;

Window Screen Color Depth

The screen.colorDepth property returns the number of bits used to display one color.

All modern computers use 24 bit or 32 bit hardware for color resolution:

• 24 bits = 16,777,216 different "True Colors"
• 32 bits = 4,294,967,296 different "Deep Colors"

Older computers used 16 bits: 65,536 different "High Colors" resolution.

Very old computers, and old cell phones used 8 bits: 256 different "VGA colors".

Example

 document.getElementById("demo").innerHTML =
"Screen Color Depth: " + screen.colorDepth;

Note: The #rrggbb (rgb) values used in HTML represents "True Colors" (16,777,216 different colors)

Window Screen Pixel Depth

The screen.pixelDepth property returns the pixel depth of the screen.

Example

 document.getElementById("demo").innerHTML =
"Screen Pixel Depth: " + screen.pixelDepth;

Note: For modern computers, Color Depth and Pixel Depth are equal.