• 几种常用移动端和pc端兼容标准


    1、移动端版本兼容 用px
    	var jsVer = 15;
    	var phoneWidth = parseInt(window.screen.width);
    	var phoneScale = phoneWidth/640;
    	var ua = navigator.userAgent;
    	if (/Android (d+.d+)/.test(ua)){
    		var version = parseFloat(RegExp.$1);
    		// andriod 2.3
    		if(version>2.3){
    			document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
    		// andriod 2.3以上
    		}else{
    			document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
    		}
    		// 其他系统
    	} else {
    		document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
    	}
    
    //移动端版本兼容 end
    
    
    2、移动端版本兼容  用rem

    function rePosition(){
    var width = document.documentElement.clientWidth || document.body.clientWidth;
    var ratio = width/750;
    if(width<=750){
    document.getElementsByTagName('html')[0].style.fontSize=100*ratio+"px";
    }else{
    document.getElementsByTagName('html')[0].style.fontSize="100px";
    }
    }
    rePosition();
    window.onresize = function(){
    rePosition();
    };

    //移动端版本兼容 end

    3、pc端响应式:

    (function (doc, win) {
    var doc = doc.documentElement;
    doc.addEventListener('DOMContentLoaded', Resize, false);
    // 当DOM加载后执行
    win.addEventListener('resize', Resize, false);
    if (doc.clientWidth) {
    Resize();
    } else {
    setTimeout(Resize, 100)
    }
    // 当屏幕发生变化时执行
    function Resize() {
    doc.style.fontSize = doc.clientWidth / 19.2 + 'px';
    }
    })(document, window)

  • 相关阅读:
    判断数组的方法
    介绍下 npm 模块安装机制,为什么输入 npm install 就可以自动安装对应的模块?
    因为这样那样的原因又滚回来了
    AFO成功
    SDOI2018
    TJOI2018
    杂题
    线段树合并
    几个dp的陈年老题
    【自家测试】2018-5-9
  • 原文地址:https://www.cnblogs.com/xuyanjiayou/p/13153494.html
Copyright © 2020-2023  润新知