美文网首页
js获取页面缩放比例

js获取页面缩放比例

作者: edgarli | 来源:发表于2019-02-20 09:31 被阅读0次

    今天在网上看到一位大神写的一篇文章,出处记不得了,只是因为我在做项目的时候需要用到所以看了一眼。
    经理要求我把两张图表上下排列(非响应式的)改成可以适配浏览器的,刚开始只是想改样式,看到代码才发现原来他是写在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.
    写这篇博客主要是为了方便自己记忆,交流学习。

    相关文章

      网友评论

          本文标题:js获取页面缩放比例

          本文链接:https://www.haomeiwen.com/subject/ogdcyqtx.html