javascript - 计算窗口宽度，包括滚动条 - CSS 媒体查询与 JS

Question

假设我已经正确推断出问题，似乎 CSSmin-screen宽度补偿了滚动条（正如预期的那样），而 JS 似乎没有做同样的事情:(

我在 Mac OSX 上使用 Firefox。我不确定这是否是特定于浏览器的，但我想知道是否有针对此问题的通用解决方案。

我做了一个JS fiddle 来演示这个问题。在我的浏览器中，CSS 和我的 JS 计算的宽度之间有 15px 的差异。

有人遇到过这个吗？

Answer 1

我似乎找到了我的问题的答案，但我不确定这是否是计算正确宽度的最有效方法。

这个想法是给body元素overflow:hidden;，然后运行函数来计算窗口宽度，然后删除overflow:hidden;样式。

像这样：

function minScreen480(){

    document.body.style.overflow = "hidden";
        if ($(window).width() >= 480) {
            // Do stuff
        }else{
            // Do stuff
        }
    document.body.style.overflow = "";
}

$(window).resize(function(){
    minScreen480();
}).trigger('resize');

似乎工作。这写得更好吗？