rem布局進入頁面樣式錯亂解決
阿新 • • 發佈：2017-10-20
return color 顯示 display add 進入 遇到 client ner
開發項目時候第一次遇到rem布局進入頁面瞬間樣式錯亂問題：
//該段js為rem布局應用 如10px = 0.1rem; (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 { //alert(clientWidth); docEl.style.fontSize = 100 * (clientWidth / 750) + ‘px‘; } }; if(!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc,false); doc.addEventListener(‘DOMContentLoaded‘, recalc, false); })(document, window);
解決方案（jq）：先設置body如下圖，然後再顯示
<body style="display: none;"> $("body").css("display","block")
input框呼起鍵盤（必須禁用方法如下）：
<input class="preDate" type="text" placeholder="請輸入預產期" onfocus="this.blur();" />
rem布局進入頁面樣式錯亂解決