今天在网上看到一位大神写的一篇文章，出处记不得了，只是因为我在做项目的时候需要用到所以看了一眼。
经理要求我把两张图表上下排列（非响应式的）改成可以适配浏览器的，刚开始只是想改样式，看到代码才发现原来他是写在jq里面的，尝试这用jq该样式的时候发现这个canvas是后渲染根本没有什么用处，搞了半天没有用修改样式的方法搞，最用才想到js监测浏览器页面的缩放可以在生产canvas的时候动态修改height于是就百度了一下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，有缩放的话会大于或者小于100.
写这篇博客主要是为了方便自己记忆，交流学习。
