跨设备自适应代码

1 <meta name="viewport" content="width=device-width, height=device-height,initial-scale=1.0, minimum-scale=1.0 , maximum-scale=1.0, user-scalable=0">

 1 <script>
 2 new function (){
 3            var raines = this;
 4            raines.width = 640;//设置默认最大宽度（一般设计稿宽度为640px）
 5            raines.fontSize = 30;//默认字体大小（为方便计算）
 6                var dpr = window.devicePixelRatio || 1;
 7                var scale = 1 / dpr;
 8                var metaEl=document.querySelector(‘meta[name="viewport"]‘);
 9                var p=document.body&&document.body.clientWidth||document.getElementsByTagName("html")[0].offsetWidth;
10            raines.widthProportion = function(){var i = p/raines.width;return i<0.5?0.5:i;};
11                raines.changePage = function(){
12                    document.getElementsByTagName("html")[0].setAttribute("style","font-size:"+raines.widthProportion()*raines.fontSize*dpr+"px !important");
13                    metaEl.setAttribute(‘content‘, ‘width=‘ + dpr * p + ‘,initial-scale=‘ + scale + ‘,maximum-scale=‘ + scale + ‘, minimum-scale=‘ + scale + ‘,user-scalable=no‘);
14                }
15            raines.changePage();
16 };
17 </script>