Difference between $(window).width() vs $(document).width()

kbvishnu picture kbvishnu · Feb 24, 2012 · Viewed 48.9k times · Source

What is the major difference between $(window).width() vs $(document).width() in jQuery? Whether window denotes the browser and document represents the body of html page? Am I correct ?

Answer

kapa picture kapa · Feb 24, 2012

From the documentation of width():

This method is also able to find the width of the window and document.

$(window).width();   // returns width of browser viewport
$(document).width(); // returns width of HTML document

Simple jsFiddle Demo

In the demo, I have set html { width: 1000px; }, which is bigger than the viewport.

The width of the body of your HTML page is a third value. $('body').width() can also differ from the other two (try body { margin: 100px; } for example).