美文网首页
移动端适配

移动端适配

作者: 葱头来了 | 来源:发表于2019-12-06 10:35 被阅读0次
        /*eslint-disable*/
        (function(window, document) {
            var docEl = document.documentElement;
            var dpr = window.devicePixelRatio || 1;

            // adjust body font size
            function setBodyFontSize() {
                if (document.body) {
                    document.body.style.fontSize = (12 * dpr) + 'px';
                } else {
                    document.addEventListener('DOMContentLoaded', setBodyFontSize);
                }
            }
            setBodyFontSize();

            // set 1rem = viewWidth / 10
            function setRemUnit() {
                var rem = docEl.clientWidth / 10;

                docEl.style.fontSize = rem + 'px';
            }

            setRemUnit();

            // reset rem unit on page resize
            window.addEventListener('resize', setRemUnit);
            window.addEventListener('pageshow', function(e) {
                if (e.persisted) {
                    setRemUnit();
                }
            });

            // detect 0.5px supports
            if (dpr >= 2) {
                var fakeBody = document.createElement('body');
                var testElement = document.createElement('div');

                testElement.style.border = '.5px solid transparent';
                fakeBody.appendChild(testElement);
                docEl.appendChild(fakeBody);
                if (testElement.offsetHeight === 1) {
                    docEl.classList.add('hairlines');
                }
                docEl.removeChild(fakeBody);
            }
        }
        )(window, document);

相关文章

网友评论

      本文标题:移动端适配

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