javascript - Ajax加載Json時(shí),移動(dòng)端頁(yè)面向左上角縮小一截兒,加載完成后才正常顯示,這該如何解決?
問(wèn)題描述
問(wèn)題: 用rem布局做移動(dòng)端頁(yè)面,利用JQ的Ajax加載Json文件,在刷新加載Json時(shí),頁(yè)面會(huì)向左上角縮一截兒,當(dāng)Json加載完成時(shí),頁(yè)面顯示正常尺寸。 試問(wèn),這種問(wèn)題該如何解決?
理想中的效果是 : 刷新頁(yè)面重新加載Json前,靜態(tài)頁(yè)面已經(jīng)加載完成,并且是正常尺寸在移動(dòng)端上顯示。
加載Json時(shí)的頁(yè)面:][1]
所引入的JS文件順序 :
<script src='http://www.cgvv.com.cn/wenda/js/jquery-1.11.2.js'></script> <script src='http://www.cgvv.com.cn/wenda/js/idangerous.swiper.js'></script> <script type='text/javascript'> //rem設(shè)置 window.onload=window.onresize=function(){ document.documentElement.style.fontSize=innerWidth/20 +’px’; } // Swiper JS var WU=new Swiper('.swiper-container',{ loop:true, //是否支持循環(huán)播放 speed:400,//延遲時(shí)間 mode:’horizontal’,// 'horizontal' 水平輪播; mode:'vertical' 垂直輪播 autoplay:2000, //自動(dòng)播放 pagination:’.pagination’, //分頁(yè)器 }) </script> <script src='http://www.cgvv.com.cn/wenda/js/index.js' type='text/javascript' charset='utf-8'></script>
問(wèn)題解答
回答1:移動(dòng)端不如試試MUI -> 斜眼笑
回答2:猜測(cè)和ajax沒(méi)關(guān)系...試試把rem設(shè)置相關(guān)的js代碼不放到onload里,而是提到頁(yè)面最開(kāi)始,或者在css中用媒體查詢粗略做個(gè)html,body的font-size初始設(shè)定值
回答3:好像連等賦值和onresize比較可疑,建議去掉后者,變成:
window.onload = function() { document.documentElement.style.fontSize=innerWidth/20 +’px’; }
試試~
