The screen object specifies information about dimensions of the user’s screen and display settings. It is special object for inspecting properties of the screen on which the current window is being rendered. There is no public standard that applies to the screen object, but all major browsers support it.
Javascript Screen Object Properties
The following are the properties of Screen object:
- availWidth: It returns available width of the screen in the pixels for application windows.
- availHeight: It returns available height of the screen in the pixels for application windows.
- colorDepth: It retrieves number of bits per pixel used for colors on the screen.
- pixelDepth: It retrieves number of bits per pixel used for screen color resolution on the screen.
- width: It returns horizontal resolution of the screen in pixels.
- height: It returns vertical resolution of the screen in pixels.
- availLeft: It returns available area of the left side of the screen for application windows.
- availTop: It returns available area of the top side of the screen for application windows.
Javascript Screen Object Example
<!DOCTYPE html>
<head>
<meta charset="ISO-8859-1">
<title>Screen Object</title>
</head>
<body>
<script type="text/javascript">
document.write("Total height is:" + screen.height + "<br>");
document.write("Total width is:" + screen.width + "<br>");
document.write("Avaialble width is:" + screen.availWidth + "<br>");
document.write("Avaialble height is:" + screen.availHeight + "<br>");
document.write("Color depth is:" + screen.colorDepth + "<br>");
document.write("Color resultion is:" + screen.pixelDepth + "<br>");
</script>
</body>
</html>
- <script type=”text/javascript”> tag is used to define client side script which uses attribute type for specifying MIME type.
- document.write(“Total height is:” + screen.height);line returns height of the screen.
- document.write(“Total width is:” + screen.width);line specifies width of the screen.
- document.write(“Avaialble width is:” + screen.availWidth);line specifies available width of the screen in the pixels.
- document.write(“Avaialble height is:” + screen.availHeight);line specifies available height of the screen in the pixels.
- document.write(“Color depth is:” + screen.colorDepth);line specifies number of bits per pixel used for colors on the screen.
- document.write(“Color resultion is:” + screen.pixelDepth);line specifies number of bits per pixel used for screen color resolution.
Javascript Screen Object Demo
- Save the file as JSscreen_example.html in your system.
- Just open the file in the browser, you will see the below picture in the browser.
When the execution process is completed successfully we will get the following output:
How To Get Operating System using JavaScript