CODEWITHSUNDEEP
javascriptjquery
Chad
Chad

Reputation: 5418

window.outerWidth VS $(window).outerWidth()

I'm just curious as to what the difference between window.outerWidth and $(window).outerWidth() is, if any.

I couldn't really find much info about this on Google, so I thought I'd appeal to the masses. This is just a general question, not a specific issue.

Upvotes: 3

Views: 5682

Answers (4)

Bergi
Bergi

Reputation: 664620

As you can read in the jQuery docs:

This method is not applicable to window and document objects; for these, use .width() instead.

While window.outerWidth gets the width of the outside of the browser window, jQuery's .width() method does return the width of browser viewport when called on a window-selecting jQuery instance. To do this, it calls a bunch of subfunctionsand hooks (see source code) to be cross-browser-compatible (but is much slower).

Upvotes: 0

SomeKittens
SomeKittens

Reputation: 39532

As to the specifics of outerWidth: jQuery's implementation lets you choose if you want the margin included in the measurement or not. Javascript's just gets the number. I couldn't tell if it included margin or not.

jQuery is just a bunch of fancy JavaScript. In fact, you can implement anything jQuery does yourself using only JavaScript (and I'd encourage you to do so)! I'd encourage you to read questions like this one.

Upvotes: 0

mdziekon
mdziekon

Reputation: 3627

From jQuery documentation (http://api.jquery.com/outerWidth/):

This method is not applicable to window and document objects; for these, use .width() instead.

So, you should use $(window).width(), which returns:

"width of browser viewport" (so with no window borders and other stuff)

window.outerWidth returns whole window width (with borders and other stuff)

Upvotes: 2

mamoo
mamoo

Reputation: 8166

Jquery's outerWidth:

Returns the width of the element, along with left and right padding, border, and optionally margin, in pixels.

If includeMargin is omitted or false, the padding and border are included in the calculation; if true, the margin is also included.

This method is not applicable to window and document objects; for these, use .width() instead.

window.outerWidth:

window.outerWidth gets the width of the outside of the browser window. It represents the width of the whole browser window including sidebar (if expanded), window chrome and window resizing borders/handles.

Upvotes: 6

Related Questions