Jquery $(window).width() excluding scrollbar width?

Question

I've got a page that sets a lot of css properties using javascript and it uses $(window).width() to determine the page width. Among other things, it sets some div widths to be the full width of the page using that method. A It's done this way because a lot of the other calculations are done in javascript.

Anyway, I'm switching to a different navigation style and I set the body's overflow-y to be hidden. Unfortunately, now that the scrollbar has disappeared I'm left with a lovely white bar at the side of my page (in every browser I've tried) that is exactly the width of the scroll bar. Without specifically calculating the width of the scroll bar, which can get messy, how can I just get the width of the full browser including the scroll bar?

Thanks!

EDIT: It was an order of operations issue, I was being an idiot. Sorry!

if you set `html, body { overflow-y: hidden; }` does it resolve? I've found certain settings that reset best with targeting both `html` and `body`. So is the question how to GET the width, or how to PREVENT that white bar? — Eli Gassert, May 28 '13 at 21:59
Maybe it has to do with the order of operations... Can you set the body's overflow-y to hidden **BEFORE** you do the rest of your sizing? — jahroy, May 28 '13 at 22:03
I just found the problem. I apologize for wasting everyone's time, as it WAS an order of operations thing. — Mr. Lavalamp, May 28 '13 at 22:04
Possible duplicate of [How to get screen width without (minus) scrollbar?](http://stackoverflow.com/questions/8339377/how-to-get-screen-width-without-minus-scrollbar) — Bengi Besçeli, Aug 02 '16 at 08:54

score 3 · Answer 1 · answered Jan 08 '14 at 16:10

3

window.outerWidth

The outerWidth property sets or returns the outer width of a window, including all interface elements (like toolbars/scrollbars).

http://www.w3schools.com/jsref/prop_win_outerheight.asp

answered Jan 08 '14 at 16:10

seanjacob

2,238
1
22
25

score 0 · Answer 2 · answered May 28 '13 at 21:52

0

use document instead

$(document).width()

answered May 28 '13 at 21:52

Antarr Byrd

24,863
33
100
188

4

Google-surfers don't let this answer scare you away. You can also do this without jQuery using `document.width` – Jordan Doyle May 28 '13 at 21:53
I hope they would not see this answer if they were not searching the tearm `jQuery`. Thank you for the comment though – ntgCleaner May 28 '13 at 21:57
Neither $(document).width() nor document.width worked...I still see a white bar where there should be a scrollbar. :/ – Mr. Lavalamp May 28 '13 at 21:57
A fiddle won't really work here because it's something specific to the page width, it's not just a div. – Mr. Lavalamp May 28 '13 at 22:01
@Mr.Lavalamp JSbin will let you view the page in full – Antarr Byrd May 28 '13 at 22:03
And JSFiddles run the page in an iFrame which can be opened up. Either way! – doppelgreener May 29 '13 at 00:00

Jquery $(window).width() excluding scrollbar width?

2 Answers2

Linked