美文网首页
适配华为手机的rem.js

适配华为手机的rem.js

作者: 曹锦花 | 来源:发表于2021-12-27 21:34 被阅读0次

    https://blog.csdn.net/weixin_46662539/article/details/109337973

    (function (doc, win) {
        var docEl = doc.documentElement,
            resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
            recalc = function () {
                var clientWidth = docEl.clientWidth;
                if (!clientWidth) return;
                if (clientWidth >= 750) {
                    docEl.style.fontSize = '100px';
                } else {
                    docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
                }
                var html = document.getElementsByTagName('html')[0];
                var settedFs = settingFs = parseInt(100 * (clientWidth / 750));
                var whileCount = 0;
                while (true) {
                    var realFs = parseInt(window.getComputedStyle(html).fontSize);
                    var delta = realFs - settedFs;
                    //不相等
                    if (Math.abs(delta) >= 1) {
                        if (delta > 0)
                            settingFs--;
                        else
                            settingFs++;
                        html.setAttribute('style', 'font-size:' + settingFs + 'px!important');
                    } else
                        break;
                    if (whileCount++ > 100)
                        break
                }
            };
        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener('DOMContentLoaded', recalc, false);
    })(document, window);
    
    

    相关文章

      网友评论

          本文标题:适配华为手机的rem.js

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