Get browser window width including scrollbar

Question

I tried to get browser window width with $(window).width();. On IE 10, it does return the full browser width, include the scroll bar. However, on Firefox and Ch

Answer 1

window.innerWidth seems to be the correct answer when needed for responsive design

Answer 2

This will get the full Window's width:

 window.outerWidth

NOTE: jQuery's outerWidth() doesn’t work on $(window)

Answer 3

window.innerWidth will give the width of the HTML and the scrollbar. This value is the value used for device width breakpoints when using media queries in CSS. Essentially, window.innerWidth is equal to the calculated CSS unit 100vw. However, window.outerWidth will give you the width of the entire window.

For example, if you had Chrome's Dev Tools open inside of the browser, window.outerWidth would be the width of the webpage + scroll bar + Chrome's Dev Tools inspector. While window.innerWidth would return the width of just the webpage + scroll bar.

Answer 4

The first answer was close, but upon further inspection it is a bit more complicated. The body.clientWidth is the width excluding the scrollbars. The window.outerWidth is the width including the scrollbars and other window elements like the window border. The window.innerWidth is the actual width of the window, including scrollbars, but not including the window border.