zoukankan      html  css  js  c++  java
  • 手机端适配

    (function (designWidth, maxWidth) {
    var doc = document,
    win = window;
    var docEl = doc.documentElement;
    var tid;
    var rootItem, rootStyle;

    function refreshRem() {
    var width = docEl.getBoundingClientRect().width;
    if (!maxWidth) {
    maxWidth = 540;
    }
    if (width > maxWidth) {
    width = maxWidth;
    }
    //与淘宝做法不同,直接采用简单的rem换算方法1rem=100px
    var rem = width * 100 / designWidth;
    //兼容UC开始
    rootStyle = "html{font-size:" + rem + 'px !important}';
    rootItem = document.getElementById('rootsize') || document.createElement("style");
    if (!document.getElementById('rootsize')) {
    document.getElementsByTagName("head")[0].appendChild(rootItem);
    rootItem.id = 'rootsize';
    }
    if (rootItem.styleSheet) {
    rootItem.styleSheet.disabled || (rootItem.styleSheet.cssText = rootStyle)
    } else {
    try {
    rootItem.innerHTML = rootStyle
    } catch (f) {
    rootItem.innerText = rootStyle
    }
    }
    //兼容UC结束
    docEl.style.fontSize = rem + "px";
    };
    refreshRem();

    win.addEventListener("resize", function () {
    clearTimeout(tid); //防止执行两次
    tid = setTimeout(refreshRem, 300);
    }, false);

    win.addEventListener("pageshow", function (e) {
    if (e.persisted) { // 浏览器后退的时候重新计算
    clearTimeout(tid);
    tid = setTimeout(refreshRem, 300);
    }
    }, false);

    if (doc.readyState === "complete") {
    doc.body.style.fontSize = "16px";
    } else {
    doc.addEventListener("DOMContentLoaded", function (e) {
    doc.body.style.fontSize = "16px";
    }, false);
    }
    })(750, 750);



    <meta name="viewport"   content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  • 相关阅读:
    USART串口通信实验
    EXTI 外部中断
    NVIC中断优先级管理
    实验1 跑马灯实验
    redis集群部署---一台主机
    zookeeper服务启动报错---Error contacting service. It is probably not running.
    shell脚本学习笔记
    最短路径算法——Floyd算法
    一篇文章学懂Shell脚本(摘抄)
    VIM空格和TAB转换
  • 原文地址:https://www.cnblogs.com/weiwentaweb/p/10313442.html
Copyright © 2011-2022 走看看