美文网首页
Js动态设置rem来实现移动端字体的自适应

Js动态设置rem来实现移动端字体的自适应

作者: ai_cuicui | 来源:发表于2018-01-24 17:24 被阅读0次

    代码是现成的,可以直接cv!

    fontsize : 1rem = 50px

    (function(doc,win){

        var docEl =doc.documentElement,

            resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',

            recalc = function(){

                var clientWidth = docEl.clientWidth>750 ? 750 :docEl.clientWidth;

                if (!clientWidth) {return};

                docEl.style.fontSize = 100 * (clientWidth/750) + 'px';

            };

        recalc();

        if (!doc.addEventListener) return;

        win.addEventListener(resizeEvt, recalc, false);

        doc.addEventListener('DOMContentLoaded', recalc, false);

    })(document,window);

    相关文章

      网友评论

          本文标题:Js动态设置rem来实现移动端字体的自适应

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