lib-flexible.js中将iphone条件下的initial-scale进行动态变换真的有必要吗?

发布于 2022-09-03 07:28:59 字数 1696 浏览 17 评论 0

有个疑问:
在ios下根据dpr的不同将页面进行缩放有没有绝对的必要?

if (!dpr && !scale) {
        var isAndroid = win.navigator.appVersion.match(/android/gi);
        var isIPhone = win.navigator.appVersion.match(/iphone/gi);
        var devicePixelRatio = win.devicePixelRatio;
        if (isIPhone) {
            // iOS下,对于2和3的屏,用2倍的方案,其余的用1倍方案
            if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {                
                dpr = 3;
            } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)){
                dpr = 2;
            } else {
                dpr = 1;
            }
        } else {
            // 其他设备下,仍旧使用1倍的方案
            dpr = 1;
        }
        scale = 1 / dpr;
    }

metaEl.setAttribute('content', 'initial-scale=' + scale + ', maximum-scale=' + scale + ', minimum-scale=' + scale + ', user-scalable=no');

我们知道动态的改变initial-scale会改变页面layout viewport,从而改变页面的html标签的宽度。
如图,
image

image

这样有一个好处是完全的高清显示,改善了「著名」的border:1px 问题。见连接:http://www.html-js.com/article/Mobile-terminal-H5-mobile-terminal-HD-multi-screen-adaptation-scheme%203041

但是除此之外我好像找不到其他这样做的理由了。

至于retina图片的适配,dpr限定为1也是同样能操作的(@2x图)

dpr进行变换还要去维护字号在不同dpr下的兼容。

基于这几个考量?lib-flexible.js中将iphone条件下的initial-scale进行动态变换真的有必要吗?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文