Introduction
In this article, we will learn in detail about Javascript screen, location, and history. We will also deal with the syntax of the properties and methods of the screen, location, and history of JavaScript window. So, without any further ado, let's get started!
Also Read, Javascript hasOwnProperty
JavaScript Window Screen
The window.screen object holds data about the screen of the user as the window object is at the top of the scope chain, the window.screen object's properties can be accessed without specifying the window(prefix).
Different properties of window screen are:
- screen.width: The screen.width property is used to get the width of the user's screen in pixels.
Syntax:
var screenWidth = window.screen.width; |
Example:
<script> document.getElementById("demo").innerHTML = "The Screen width is " + screen.width; </script> |
- screen.height: The screen.height property is used to get the height of the user's screen in pixels.
Syntax:
var screenHeight = window.screen.height; |
Example:
<script> document.getElementById("demo").innerHTML = "The Screen height is " + screen.height; </script> |
- screen.availWidth: The screen.availWidth property is used to get the available width of the user's screen in pixels (width of the screen of user - interface elements such as the Windows Taskbar).
Syntax:
var availableWidth = window.screen.availWidth; |
Example:
<script> document.getElementById("demo").innerHTML = "The available width of screen is " + screen.availWidth; </script> |
- screen.availHeight: The screen.availHeight property is used to get the available height of the user's screen in pixels (height of the screen of user - interface elements such as the Windows Taskbar).
Syntax:
var availableHeight = window.screen.availHeight; |
Example:
<script> document.getElementById("demo").innerHTML = "The available width of screen is "+ screen.availHeight; </script> |
- screen.colorDepth: The screen.colorDepth property is used to get the number of bits used to display one color. The color depth of a device's screen indicates how many colors it can display.
Syntax:
var bitColorDepth = window.screen.colorDepth; |
Example:
<script> document.getElementById("demo").innerHTML = "The color depth of screen is " + screen.colorDepth; </script> |
- screen.pixelDepth: Using the screen.pixelDepth, we can determine the pixel depth of the screen. Pixel depth refers to the count of bits per pixel used by the hardware of the system display. Color depth and pixel depth are equal on modern devices.
Syntax:
var pixelDepth = window.screen.pixelDepth; |
Example:
<script> document.getElementById("demo").innerHTML = "The pixel depth of the screen is " + screen.pixelDepth; </script> |