移动端还原设计图

(function (doc, win) {
            var html = doc.getElementsByTagName("html")[0],
                // orientationchange->手机屏幕转屏事件
                // resize->页面大小改变事件(兼容pc,移动端)
                reEvt = "orientationchange" in win ? "orientationchange" : "resize",
                designWidth=1920,
                setFontSize = function () {
                    var clientW = doc.documentElement.clientWidth || doc.body.clientWidth;
                    if (!clientW) {
                        return;
                    }
                    html.style.fontSize = 100 * (clientW / 1920) + "px";
                }
            var resetFontSize=function(){
                if(win.resetFontTimeout){
                    clearTimeout(win.resetFontTimeout);
                }
                //防抖
                win.resetFontTimeout=setTimeout(function(){
                    setFontSize();
                },500);
            }
            win.addEventListener(reEvt, resetFontSize);
            // DOMContentLoaded->dom加载完就执行,onload要dom/css/js都加载完才执行
            doc.addEventListener("onload", setFontSize);
        })(document, window);

posted @ 2018-10-10 17:26  吃馒头的火鸡  阅读(255)  评论(0编辑  收藏  举报