Javascript 获取包括滚动条的浏览器窗口宽度
我尝试使用Javascript 获取包括滚动条的浏览器窗口宽度,javascript,jquery,google-chrome,firefox,Javascript,Jquery,Google Chrome,Firefox,我尝试使用$(window.width())获取浏览器窗口宽度。在IE 10上,它返回完整的浏览器宽度,包括滚动条。但是,在Firefox和Chrome上,都返回不带滚动条的值 如何将浏览器宽度包括在滚动条中?因为我需要检测到的宽度与CSS完全相同 谢谢。这将获得整个窗口的宽度: window.outerWidth 注意:jQuery的outerWidth()不适用于$(窗口)第一个答案很接近,但经过进一步检查,它有点复杂。body.clientWidth是不包括滚动条的宽度。窗口。oute
$(window.width())获取浏览器窗口宽度代码>。在IE 10上,它返回完整的浏览器宽度,包括滚动条。但是,在Firefox和Chrome上,都返回不带滚动条的值
如何将浏览器宽度包括在滚动条中?因为我需要检测到的宽度与CSS完全相同
谢谢。这将获得整个窗口的宽度:
window.outerWidth
注意:jQuery的outerWidth()
不适用于$(窗口)
第一个答案很接近,但经过进一步检查,它有点复杂。body.clientWidth
是不包括滚动条的宽度。窗口。outerWidth
是包含滚动条和其他窗口元素(如窗口边框)的宽度。窗口。innerWidth
是窗口的实际宽度,包括滚动条,但不包括窗口边框
窗口。当需要响应性设计时,innerWidth
似乎是正确的答案。innerWidth
将给出HTML和滚动条的宽度。此值是在CSS中使用媒体查询时用于设备宽度断点的值。本质上,window.innerWidth
等于计算的CSS单位100vw
。但是,window.outerWidth
将显示整个窗口的宽度
例如,如果在浏览器的内部打开Chrome的开发工具,
窗口。outerWidth
将是网页的宽度+滚动条+Chrome的开发工具检查器。而window.innerWidth
将只返回网页+滚动条的宽度。美元(document.width()如何我需要检测到的宽度与CSS完全相同。
我们谈论的CSS属性是什么?我不知道CSS属性是什么。但这是引导响应CSS。谢谢。但还是一样。如何检测滚动条宽度?它的值与以前相同。浏览器的解决方法如何?类似于对css的IE黑客攻击。如果页面右侧有javascript inspector窗口,则outerWidth
将包括inspector的宽度,并且当您调整页面大小时,outerWidth
甚至不会更改。我认为outerWidth
的唯一目的应该是用于谷歌分析类型的浏览器窗口大小日志记录。无论是否打开inspector窗口,都无法用于布局目的。您可能需要innerWidth
,它相当于响应式设计的“视口宽度”,它返回1920
,即使我在chrome developer tools响应式工具上将宽度设置为768,这正是我所需要的。根据OP在问题中的评论,这应该是公认的答案。这就是答案!即使三年后,这也应该是正确的答案。