Innerheight and ClientHeight, Innerwidth and ClientWidth, scrollleft and Pagexoffset attributes

Differentiate between Innerheight and ClientHeight, Innerwidth and ClientWidth, scrollleft and Pagexoffset attributes

Tags:innerheightclientheightinnerwidthclientwidthoffsetleft, etc.

Window object:

(1) Innerheight property: The height of the document display area in the window, excluding the menu bar, toolbar, and other parts. This property is readable and writable.

IE does not support this property, and the ClientHeight property of the body element in IE is the same as this property.

(2) Innerwidth property: The width of the document display area in the window, also excluding the border. This property is readable and writable.

IE does not support this property, and the ClientWidth property of the body element in IE is the same as this property.

The ClientHeight and ClientWidth properties are read-only.

In addition, IE does not support outerwidth, outerheight properties.

(3) Pagexoffset property: Integer read-only property that represents the number of pixels that the document has scrolled to the right.

IE does not support this property and is substituted with the ScrollLeft property of the BODY element.

(4) pageYOffset property: The integer read-only property that represents the number of pixels that the document has scrolled down.

IE does not support this property and is substituted with the ScrollTop property of the BODY element.

Compatible with IE and Dom browser, how to get the width and height of the document display area in the window, using the?: Conditional statement, as follows:

Windows.innerwidth? Windows.innerWidth:document.body.clientWidth;

Windows.innerheight? Windows.innerHeight:document.body.clientHeight;

Element object:

Offsetleft, offsettop property: Gets the coordinate position of the element relative to the upper-left corner of the document.

Innerheight and ClientHeight, Innerwidth and ClientWidth, scrollleft and Pagexoffset attributes