In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > properties > innerWidth (window)

innerWidth property (window)

Browser support:

9

Returns the width of the browser's client area, including the vertical scrollbar, if rendered.

Note: The innerWidth property is supported in Internet Explorer from version 9.

The innerWidth property is rarely useful, because scrollbars are not part of the document working area. Use the cross-browser clientWidth property of the html element instead. It returns the width of the browser's client area without the vertical scrollbar.

You can get the height of the client area, including the vertical scrollbar with the innerHeight property.
You can get the height of the client area, excluding the vertical scrollbar with the clientHeight property.
The top-left corner of the client area relative to the top-left corner of the screen can be retrieved with the screenLeft and screenTop properties.
If you need the total width of the browser window, use the outerWidth property.
If you need information about the dimensions of the screen, use the screen object.
To get the width of the document or an element in the document, please see the pages for the clientWidth, offsetWidth and scrollWidth properties.

Syntax:

object.innerWidth;

You can find the related objects in the Supported by objects section below.

This property is read/write.

Possible values:

Integer that represents the width of the window client area, in pixels.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the innerWidth property:

<head>
    <script type="text/javascript">
        function GetClientWindowSize () {
            if ('innerWidth' in window) {   // all browsers, except IE before version 9
                alert ("The width of the client area including the vertical scrollbar: " + window.innerWidth);
            }
            else {  // Internet Explorer before version 9
                alert ("The width of the client area without the vertical scrollbar: " + document.documentElement.clientWidth);
            }
            
            if ('innerHeight' in window) {  // all browsers, except IE before version 9
                alert ("The height of the client area including the horizontal scrollbar: " + window.innerHeight);
            }
            else {  // Internet Explorer before version 9
                alert ("The height of the client area without the horizontal scrollbar: " + document.documentElement.clientHeight);
            }
        }
    </script>
</head>
<body>
    <button onclick="GetClientWindowSize ();">Get the size of the client window</button>
</body>