rem

2018-03-21  本文已影响0人  He_084f

function Rem() {

var docEl = document.documentElement,

oSize = docEl.clientWidth / 7.5;

//如果750设计稿oSize 100、  如果640设计稿 oSize 85

if (oSize > 100) {

oSize = 100;

}

docEl.style.fontSize = oSize + 'px';

}

window.addEventListener('resize', Rem, false);

Rem();

赵星(Zara.zhao)  16:42:08

我也看到过一段计算根节点大小的js,网易的网站上是这么做的。 

    (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';

                    }

                };

        if (!doc.addEventListener) return;

        win.addEventListener(resizeEvt, recalc, false);

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

    })(document, window);

最后用的

       

        (function (doc, win) {   

            var docEl = doc.documentElement,   

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

            recalc = function () {   

            var clientWidth = docEl.clientWidth;   

            if (!clientWidth) return;   

            docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';   

        };   

        if (!doc.addEventListener) return;   

        win.addEventListener(resizeEvt, recalc, false);   

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

        })(document, window);   

我用过的

var docEl = doc.documentElement,

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

    recalc =function() {

var clientWidth = docEl.clientWidth;

      if (!clientWidth)return;

      if (clientWidth >=750) clientWidth =750;

      if (clientWidth <=320) clientWidth =320;

      docEl.style.fontSize =625 * (clientWidth /750) +'%';

    };

  if (!doc.addEventListener)return;

  win.addEventListener(resizeEvt, recalc, false);

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

})(document, window);

文章:http://caibaojian.com/simple-flexible.html

上一篇下一篇

猜你喜欢

热点阅读