JavaScript BOM | Window Screen
The Browser Object Model (BOM) is a browser-specific convention referring to all the objects exposed by the web browser. The BOM allows JavaScript to “interact with” the browser.
The object of window represents a browser window and all its corresponding features. A window object is created automatically by the browser itself.
Java Script’s window.screen object contains information about the user’s screen. It can also be written without the window prefix.
Properties:
- screen.width
- screen.height
- screen.availWidth
- screen.availHeight
- screen.colorDepth
- screen.pixelDepth
- screen.width: screen.width property returns the users screen width in pixels.
<!DOCTYPE html><html><body><p id="GFG"></p><script>document.getElementById("GFG").innerHTML =" The Screen width is "+ screen.width;</script></body></html>chevron_rightfilter_noneOutput :
The Screen width is 1600
- screen.height: screen.height property returns the users screen height in pixels.
<!DOCTYPE html><html><body><p id="GFG"></p><script>document.getElementById("GFG").innerHTML =" The screen height is "+ screen.height;</script></body></html>chevron_rightfilter_noneOutput :
The screen height is 900
- screen.availWidth: screen.availWidth property returns the users screen width in pixels, excluding the interface features.
<!DOCTYPE html><html><body><p id="GFG"></p><script>document.getElementById("GFG").innerHTML ="The available screen width is "+ screen.availWidth;</script></body></html>chevron_rightfilter_noneOutput :
The available screen width is 1549
- screen.availHeight: screen.availHeight property returns the users screen height in pixels excluding the interface features.
<!DOCTYPE html><html><body><p id="GFG"></p><script>document.getElementById("GFG").innerHTML ="The available screen height is "+ screen.availHeight;</script></body></html>chevron_rightfilter_noneOutput :
The available screen height is 876
- screen.colorDepth: screen.colorDepth property returns the bits (number) to be used to display one color.
Usually, 24 bit or 32 bit hardware is used for color resolution.
24 bits = 16, 777, 216 different (True Colors)
32 bits = 4, 294, 967, 296 different (Deep Colors)<!DOCTYPE html><html><body><p id="GFG"></p><script>document.getElementById("GFG").innerHTML ="The screen color depth is "+ screen.colorDepth;</script></body></html>chevron_rightfilter_noneOutput :
The screen color depth is 24
- screen.pixelDepth: screen.pixelDepth property returns the pixel depth of the screen.
<!DOCTYPE html><html><body><p id="GFG"></p><script>document.getElementById("GFG").innerHTML ="The screen pixel depth is "+ screen.pixelDepth;</script></body></html>chevron_rightfilter_noneOutput :
The screen pixel depth is 24
- How to center a popup window on screen?
- Javascript | Window Open() & Window Close Method
- Javascript | Window Blur() and Window Focus() Method
- How to get the width of device screen in JavaScript ?
- How to detect touch screen device using JavaScript?
- How to Dim entire screen except a fixed area using JavaScript ?
- Javascript | Window prompt() Method
- Javascript | Window confirm() Method
- JavaScript | Window print() Method
- JavaScript | Window getComputedStyle() Method
- JavaScript | Window innerWidth and innerHeight Properties
- How to close current tab in a browser window using JavaScript?
- How to check a webpage is loaded inside an iframe or into the browser window using JavaScript?
- Web Window API | Window locationbar property
- Web Window API | Window scrollbars property
Recommended Posts:
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.
