美文网首页react
window缩放150%前端适配

window缩放150%前端适配

作者: 银角大王__ | 来源:发表于2021-11-05 16:01 被阅读0次

window缩放125% 150% ...以及 Retina屏前端适配

      (function () {
        var ratio = 0,
        screen = window.screen,
        ua = navigator.userAgent.toLowerCase();
        let view = document.querySelector('body');
    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 !== 1) {
        if (ratio >= 2) {
            ratio = ratio / 2
        } else if (ratio >= 3) {
            ratio = ratio / 3
        }
        view.style.zoom = -0.62 * ratio + 1.65;
    }
    console.log("dpi", ratio)
})(window);

相关文章

  • window缩放150%前端适配

    笔记本缩放125% 150% ...以及 Retina屏前端适配

  • 屏幕适配方案:缩放Window

    背景: 公司有个项目,是11年开发的,那时的iPad只有1024x768的分辨率,所以没有屏幕适配的问题,fram...

  • 适配缩放

    简介 关于UGUI的一些简单适配 Canvas OverLay:位于屏幕最上方,遮挡住3D场景以及Camera和W...

  • 屏幕适配

    这里是画布大小适配的方案 1 .适配的思路, 可利用相机缩放让内容区域缩放到最合适的大小, 然后利用相机移动让内容...

  • WKWebView加载html图片过大

    WKWebView加载html图片过大,将图片缩放适配屏幕方法

  • 适配详解

    图片适配、控件适配,xib适配。Masonry //图片适配 //3gs和4的屏幕缩放系数是1. 4s~6s屏幕缩...

  • view

    限制地图范围-需要配合限制地图缩放级别 自适配区域

  • 适配和缩放

    rem适配 1 .rem是css3新增的一个相对单位。是指相对于根元素的字体大小的单位 2 .根节点的font-s...

  • Android屏幕适配之--自定义像素的缩放比例来实现屏幕适配

    Android屏幕适配之--自定义像素的缩放比例来实现屏幕适配 在Android的适配中,可以采用自定义布局的形式...

  • 13 Slide in on Scroll

    效果 Demo Github 知识点 translateX() 平移 scale() 缩放 window.scr...

网友评论

    本文标题:window缩放150%前端适配

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