JS实现移动端页面按手机屏幕分辨率自动缩放的最强代码

天启VIP6年

手机的屏幕有大有小，移动web最好做成响应式布局，也就是自适应屏幕，没有固定宽高，这样的话，在所有手机上都可以正常显示。关于移动端页面按手机屏幕分辨率自动缩放的JS代码

1. <script>
   
2. var phoneWidth = parseInt(window.screen.width);
   
3. var phoneHeight = parseInt(window.screen.height);
   
4. var phoneScale = phoneWidth/750;//除以的值按手机的物理分辨率
   
5. var ua = navigator.userAgent;
   
6. if (/Android (\d+\.\d+)/.test(ua)) {
   
7. var version = parseFloat(RegExp.$1);
   
8. // andriod 2.3
   
9. if (version > 2.3) {
   
10. document.write('<meta name="viewport" content="width=device-width,initial-scale='+phoneScale+',minimum-scale='+phoneScale+',maximum-scale='+phoneScale+',user-scalable=no">');
    
11. // andriod 2.3以上
    
12. } else {
    
13. document.write('<meta name="viewport" content="width=device-width,user-scalable=no">');
    
14. }
    
15. // 其他系统
    
16. } else {
    
17. document.write('<meta name="viewport" content="width=device-width, initial-scale='+phoneScale+',minimum-scale='+phoneScale+',maximum-scale ='+phoneScale +',user-scalable=no,">');
    
18. }
    
19. </script>  

复制代码