計算窗口寬度，包括滾動條 - CSS媒體查詢與JS

假設我已經正確地推斷了這個問題，似乎CSS min-screen寬度補償了一個滾動條（如預期的那樣），而JS似乎沒有做同樣:(計算窗口寬度，包括滾動條 - CSS媒體查詢與JS

我使用的是Firefox在Mac OSX。我不知道這是否是針對特定瀏覽器，但我不知道是否有一個通用的解決這個問題。

我做a JS fiddle to demonstrate the problem。在我的瀏覽器中，CSS和我的JS計算的寬度之間有15px的差異。

任何人en之前反擊過？

2013-01-11 norsewulf

我發現了一個類似的問題，並且有人建議使用'$（'body'）。innerWidth（）'，它似乎適用於它們。我認爲這看起來很有希望，但在我看來，它似乎在'$（window）.width（）'產生了相同的結果。不知道有什麼區別。 – norsewulf

我似乎已經找到了我的問題的答案，但我不確定這是否是計算正確寬度的最有效方法。

我們的想法是，得到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');

似乎工作。這寫得更好嗎？

來源

2013-01-11 19:25:13 norsewulf

計算窗口寬度，包括滾動條 - CSS媒體查詢與JS

回答

相關問題