JavaScript方法获取屏幕缩放比例与分辨率

发布日期：2022/9/12 7:25:15      浏览量：

        开发一些前端页面的时候，会考虑到一些设备屏幕的兼容性问题，这个时候需要根据屏幕的分辨率以及缩放比例来进行实时的宽高设定，所以我总结了用JavaScript方法进行获取用户电脑屏幕的分辨率和缩放比例的数据：

 获取屏幕缩放比例

//获取屏幕缩放比例
function getRatio()
{
    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)
        {
            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;
}

获取分辨率
   屏幕分辨率的高：window.screen.height*getRatio()/100   //乘以缩放比例为真实的像素
   屏幕分辨率的宽：window.screen.width*getRatio()/100    //乘以缩放比例为真实的像素
   屏幕可用工作区高度：window.screen.availHeight;    
   屏幕可用工作区宽度：window.screen.availWidth;