Difference between screen and window property?
Solution 1
screen
is actually window.screen
since window
is the context for globals.
A window
object (obtained through document.defaultView
) returns information about both the window and the viewport. To get the application window size use window.outerHeight
, to get viewport size use window.innerHeight
.
The screen
object refers to the actual monitor window or desktop size. Note that if you have a multi-mon setup then you will have multiple screen
objects. A window
object belongs to a single screen
, though not very window
belongs to the same screen
. I do not know what happens when a browser window spans multiple screen
s.
From all this, you can determine that if you are running a full-screen browser then window.outerHeight == window.innerHeight == screen.height
.
Source: https://developer.mozilla.org/en-US/docs/DOM/window.screen and https://developer.mozilla.org/en-US/docs/DOM/window
Solution 2
- window.screen.height
- window.screen.width
- height/width of the screen or monitor in pixels
- window.screen.availHeight
- window.screen.availWidth
- height/width of the screen or monitor, in pixels, minus permanent or semi-permanent user interface features displayed by the operating system, such as the Taskbar on Windows or device status bar on smart phones
- window.innerHeight
- window.innerWidth
- height/width of the content area of the browser window including, if rendered, the horizontal/vertical scrollbar
- window.outerHeight
- window.outerWidth
- height/width of the outside of the browser window
Solution 3
What is the difference between window, screen, and document in Javascript? is pretty much this same question. To paraphrase the accepted answer and add some info that I feel it could use:
window
in the root object. Any variables or functions you define are in some way children of the window
object. So if you do var something="blah"
in a script tag, you can later access that variable in 3 ways - something
, window.something
or window["something"]
.
screen
is one of the children of window that is created by the browser. however, for the same reason that you can access window.something
as something
, you can access it either as window.screen
or screen
. This contains the properties of the actual screen, and it is where I would go to get the details you want (unless you have access to a framework like jQuery or Prototype, in which case they can probably give you this information without worries about browser compatibility).
Elango_Thanumalayan
Updated on July 28, 2022Comments
-
Elango_Thanumalayan almost 2 years
In my Web application , am in need to use the browser window's Height & Width. So I used Screen.Width , Screen.Height properties in JavaScript to get the Width & Height. While am surfing I got another property as Window.Width , Window.Height. Can anyone tell me , which property gives me the Size of Browser window.....Screen (or) Window ?
-
PmmZenha about 11 yearsCheck this link stackoverflow.com/questions/9895202/…
-
Elango_Thanumalayan about 11 yearsIssa Qandil- Thank's for the Link. But my question is What does WINDOW refers to ? What does Screen refers to ? either my Monitor size (or) Browser window size ?
-