每天坐在教室里，但眼神总是看着窗外的风景，不知不觉的默默发呆。我一直急速前行，穿梭于人人之间。试图借应接不暇的风景让我褪去对你的思念。
有些网站的访客因为显示器的原因为达到比较好的视觉效果，会对浏览器中的网页进行缩放操作。注意，这里的缩放并不是操作系统的缩放，而是浏览器使用快捷键( 按Ctrl和+号键或者-号键的缩放)或按住 ctrl 键和鼠标滚轮进行的网页缩放。
为了使用网页达到最的视觉效果，制作网页时需要对访客进行提醒，以避免用户缩放网页过大或过小，对网页的排版造成混乱！
js 检测浏览器是否缩放的代码
示例代码：
var ratio = 0;
var screen = window.screen;
var ua = navigator.userAgent.toLowerCase();
if (window.devicePixelRatio !== undefined) {
ratio = window.devicePixelRatio;
} else if (~ua.indexOf('msie')) {
if (screen.deviceXDPI && screen.logicalXDPI) { //IE
ratio = screen.deviceXDPI / screen.logicalXDPI;
}
} else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
ratio = window.outerWidth / window.innerWidth;
}
if(ratio == 1){
console.log('网页正常大小！');
} else if(ratio > 1){
console.log('网页被放大！');
}else{
console.log('网页被缩小！');
}
代码理解
1、浏览器的标准检测接口，window.devicePixelRatio 是设备上物理像素和设备独立像素的比例，该属性可以用于检测网页是否被缩放了。
2、在PC的浏览器上，window.devicePixelRatio 在无缩放的情况下的值为1，小于1则为缩小状态，大于1则为放大状态！
3、IE浏览器提供了 window.screen.deviceXDPI 和 window.screen.logicalXDPI 两个属性，deviceXDPI 就是对应的设备上的物理像素，而 logicalXDPI 就是对应了设备独立像素的比例。
4、对于上面两种接口都不支持的浏览器，可以使用 window.outerWidth 和 window.innerWidth 这两个属性。
js 检测浏览器是否缩放并返回缩放的比例
js自定义一个函数
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;
};
调用函数：
//如果值为 100，则为正常大小 console.log(detectZoom());
以上就是javascript检测浏览器是否缩放并获取缩放比例的方法。成功都永远不会言弃，放弃者永远不会成功。更多关于javascript检测浏览器是否缩放并获取缩放比例的方法请关注haodaima.com其它相关文章！
