zoukankan      html  css  js  c++  java
  • rem(根据判断手机屏幕大小自动调整rem值的js代码)

    //可以直接引用这个js文件

    !function(win) {
     function resize() {
      var domWidth = domEle.getBoundingClientRect().width;
      if(domWidth / v > 540){
       domWidth = 540 * v;
      }
      win.rem = domWidth / 16;
      domEle.style.fontSize = win.rem + "px";
     }
     var v, initial_scale, timeCode, dom = win.document, domEle = dom.documentElement, viewport = dom.querySelector('meta[name="viewport"]'), flexible = dom.querySelector('meta[name="flexible"]');
     if (viewport) {
      //viewport:<meta name="viewport"content="initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5,user-scalable=no,minimal-ui"/>
      var o = viewport.getAttribute("content").match(/initial-scale=(["']?)([d.]+)1?/);
      if(o){
       initial_scale = parseFloat(o[2]);
       v = parseInt(1 / initial_scale);
      }
     } else {
      if (flexible) {
       var o = flexible.getAttribute("content").match(/initial-dpr=(["']?)([d.]+)1?/);
       if(o){
        v = parseFloat(o[2]);
        initial_scale = parseFloat((1 / v).toFixed(2))
       }
      }
     }
     if (!v && !initial_scale) {
      var n = (win.navigator.appVersion.match(/android/gi), win.navigator.appVersion.match(/iphone/gi));
      v = win.devicePixelRatio;
      v = n ? v >= 3 ? 3 : v >= 2 ? 2 : 1 : 1, initial_scale = 1 / v
     }
     //没有viewport标签的情况下
     if (domEle.setAttribute("data-dpr", v), !viewport) {
      if (viewport = dom.createElement("meta"), viewport.setAttribute("name", "viewport"), viewport.setAttribute("content", "initial-scale=" + initial_scale + ", maximum-scale=" + initial_scale + ", minimum-scale=" + initial_scale + ", user-scalable=no"), domEle.firstElementChild) {
       domEle.firstElementChild.appendChild(viewport)
      } else {
       var m = dom.createElement("div");
       m.appendChild(viewport), dom.write(m.innerHTML)
      }
     }
     win.dpr = v;
     win.addEventListener("resize", function() {
      clearTimeout(timeCode), timeCode = setTimeout(resize, 300)
     }, false);
     win.addEventListener("pageshow", function(b) {
      b.persisted && (clearTimeout(timeCode), timeCode = setTimeout(resize, 300))
     }, false);
     /* 个人觉得没必要完成后就把body的字体设置为12
     "complete" === dom.readyState ? dom.body.style.fontSize = 12 * v + "px" : dom.addEventListener("DOMContentLoaded", function() {
      //dom.body.style.fontSize = 12 * v + "px"
     }, false);
     */
     resize();
    }(window);

  • 相关阅读:
    MFC编程习惯
    光源的频闪与常亮
    相机的选择——卷帘快门(Rolling Shutter)与全局快门(Global Shutter)
    Halcon标定(以40*40标定板为例)
    DALSA线阵相机使用教程(以16K为例)、保存配置文件ccf细节
    打包exe(使用Inno Setup)
    机器视觉项目总结——镜头
    Qt(MinGW版本)utf8终端中文乱码解决方案
    Qt(MinGW版本)安装
    (C#)Windows Shell 外壳编程系列7
  • 原文地址:https://www.cnblogs.com/yuejie/p/5994789.html
Copyright © 2011-2022 走看看