jQuery: How to Find the Dimensions of the Window and Document

Before going ahead, it is important to completely understand that window’s height & width can be different from the document’s height & width. We refer the dimensions of the window to the size of the viewport (an available portion of a browser for displaying). But we say document’s dimensions as size of the document itself.

According to the situation, the document height is always greater that the height of the window, and width of document is of at-least the window’s width but in some cases it is greater that the width of window. Now if you want to grab the height and width of the window & document in pixels. Below is the jQuery code snippet for doing this.

[code type=”php”]
$(document).ready(function() {
//Returns the height & width of window
alert(‘Height of the Window is: ‘ + $(window).height());
alert(‘Width of the Window is: ‘ + $(window).width());

//Returns the height & width of the document
alert(‘Height of the Document is: ‘ + $(window).height());
alert(‘Width of the Document is: ‘ + $(window).width());
});
[/code]

Duan Lingxin

Duan Lingxin

Content crafter and chief editor at Scratching Info. Also regular contributor on other major online tech platforms. Security Specialist by day and a writer by night, he does his best to instill his knowledge about tech while delivering inspiring and life changing resources through his writing,

More Posts - Website

Leave a Comment