美文网首页
pc端响应式js

pc端响应式js

作者: 瞳孔里的温柔你看得见不 | 来源:发表于2020-03-24 12:55 被阅读0次

    /* 当设计图是1920时,规定HTML的FONT-SIZE的值是100. 也就是,当浏览器窗口调整到1920PX时,1REM=100PX,如果要设定一个160PX(1920设计图时)的margin-top,那么REM设置值是1.6rem. */

    (function(win) {

    var tid;

    function refreshRem() {

    let designSize = 1920; // 设计图尺寸;

    let html = document.documentElement;

    let wW = html.clientWidth; // 窗口宽度

    let rem = wW * 100 / designSize;

    document.documentElement.style.fontSize = rem + 'px';

    }

    win.addEventListener('resize', function() {

    clearTimeout(tid);

    tid = setTimeout(refreshRem, 300);

    }, false);

    win.addEventListener('pageshow', function(e) {

    if (e.persisted) {

    clearTimeout(tid);

    tid = setTimeout(refreshRem, 300);

    }

    }, false);

    refreshRem();

    })(window);

    相关文章

      网友评论

          本文标题:pc端响应式js

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