美文网首页
移动端rem单位转换

移动端rem单位转换

作者: 蕉下客_661a | 来源:发表于2019-08-05 16:00 被阅读0次
            <script>
            function fontSize(px) {
            var winWidth = window.innerWidth;
            var winHeight = window.innerHeight;
            var oHtml = document.querySelector("html");
            var oBody = document.querySelector("body");
            px = px || 1080;
            var fontsize;
            if (winWidth < 320) {
                fontsize = 10;
            } else if (320 <= winWidth && winWidth <= 750) {
                fontsize = winWidth * 0.0625;
            } else {
                fontsize = px * 0.0625; //46.875
            }
            oHtml.style.fontSize = fontsize + "px";
            if (winWidth == 414) {
                oHtml.dataset.dpr = 3;
                fontsize = winWidth * 2 / 3 * 0.0625 + "px";
            } else {
                oHtml.dataset.dpr = 2;
            }
    
            if (oBody) {
                oBody.style.width = winWidth + "px";
                oBody.style.height = winHeight + "px";
            }
            return fontsize;
        }
    
        (function () {
            function o() {
                fontSize(414);
            }
            var e = null;
            window.addEventListener("resize", function () {
                clearTimeout(e), e = setTimeout(o, 300)
            }, !1), o()
        })(window);
        </script>
    

    相关文章

      网友评论

          本文标题:移动端rem单位转换

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