Learn JavaScript for Web Development

JavaScript is most versatile languages to code applications for the browser, desktop, phone or tablet. Write program for client browser or web server. Build interactive web site with JavaScript.

JavaScript - Screen Object


The JavaScript screen object holds information of browser screen. It can be used to display screen width, height, colorDepth, pixelDepth etc.

The navigator object is the window property, so it can be accessed by:

window.screen

Or,

screen

Property of JavaScript Screen Object

There are many properties of screen object that returns information of the browser.

No.PropertyDescription
1widthreturns the width of the screen
2heightreturns the height of the screen
3availWidthreturns the available width
4availHeightreturns the available height
5colorDepthreturns the color depth
6pixelDepthreturns the pixel depth.

Example of JavaScript Screen Object

Let’s see the different usage of screen object.

<script>
document.writeln("<br/>screen.width: "+screen.width);
document.writeln("<br/>screen.height: "+screen.height);
document.writeln("<br/>screen.availWidth: "+screen.availWidth);
document.writeln("<br/>screen.availHeight: "+screen.availHeight);
document.writeln("<br/>screen.colorDepth: "+screen.colorDepth);
document.writeln("<br/>screen.pixelDepth: "+screen.pixelDepth);
</script>

screen.width: 1366
screen.height: 768
screen.availWidth: 1366
screen.availHeight: 728
screen.colorDepth: 24
screen.pixelDepth: 24