摘要：這篇JavaScript欄目下的“javascript檢測瀏覽器的縮放狀態實現代碼”，介紹的技術點是“JavaScript、檢測瀏覽器、縮放狀態、實現代碼、瀏覽器、代碼”，希望對大家開發技術學習和問題解決有幫助。

這里所說的縮放不是指瀏覽器大小的縮放，而是指瀏覽器網頁內容的百分比縮放(按Ctrl和+號鍵或者-號鍵的縮放)。

檢測這種縮放有很種方法，QQ空間都通過flash來檢測瀏覽器是否處于縮放。這里提供javascript的方法來檢測瀏覽器的縮放。

對于 IE6，就直接無視了，因為 IE6 只能對文本進行縮放。

先來說說瀏覽器提供的標準檢測接口，window.devicePixelRatio 是設備上物理像素和設備獨立像素的比例，該屬性就可以用于檢測網頁是否被縮放了。在普通的 PC 瀏覽器上，在默認無縮放的情況下其默認值是 1。目前Firefox、chrome等都得到了很好的支持。

好吧，接下來該說說 IE 的處理方法了。IE 提供了 window.screen.deviceXDPI 和 window.screen.logicalXDPI 兩個屬性，deviceXDPI 就是對應的設備上的物理像素，而 logicalXDPI 就是對應了設備獨立像素的比例。估計標準的檢測接口也只是基于 IE 這種方法的一種改進。這兩個屬性在 windows XP+ 以上的系統上的默認值都是 96，因為系統默認的就是 96dpi 。

對于以上兩種都不支持的瀏覽器，還可以利用window.outerWidth 和 window.innerWidth 這兩個屬性。outerWidth 返回的是窗口元素的外部實際寬度，innerWidth 返回的是窗口元素的內部實際寬度，這兩個寬度都包含了滾動條在內的寬度。

有了這些屬性基本就可以搞定 PC 瀏覽器上常見的瀏覽器了。實現代碼如下：

detectZoom 函數的返回值如果是 100 就是默認縮放級別，大于 100 則是放大了，小于 100 則是縮小了。

function detectZoom (){

var ratio = 0,

screen = window.screen,

ua = navigator.userAgent.toLowerCase();

if (window.devicePixelRatio !== undefined) {

ratio = window.devicePixelRatio;

}

else if (~ua.indexOf('msie')) {

if (screen.deviceXDPI && screen.logicalXDPI) {

ratio = screen.deviceXDPI / screen.logicalXDPI;

}

}

else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {

ratio = window.outerWidth / window.innerWidth;

}

if (ratio){

ratio = Math.round(ratio * 100);

}

return ratio;

};

原創文章，轉載請注明： 轉載自前端開發

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的java缩放浏览器_javascript检测浏览器的缩放状态实现代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。