zoukankan      html  css  js  c++  java
  • 安卓4.0下rem显示不正常的问题

    在项目中使用了rem为单位,结果在Oppo和4.0下某些浏览器rem工作不正常,font-size计算出来的px总是大于预期的值,因此加了个Hack

    var docEl = doc.documentElement,
    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
    recalc = function() {
    var clientWidth = docEl.clientWidth;
    if (!clientWidth) return;
    docEl.style.fontSize = 100 * (clientWidth / 320) + 'px';
    correctPx()
    };
    // 校正
    function correctPx(){
    var docEl = document.documentElement;
    var clientWidth = docEl.clientWidth;
    if (!clientWidth) return;
    var div = document.createElement('div');
    div.style.width = '1.4rem';
    div.style.height = '0';
    document.body.appendChild(div);
    var ideal = 140 * clientWidth / 320;
    var rmd = (div.clientWidth / ideal);
    if(rmd >1.2)
    docEl.style.fontSize = 100 * (clientWidth / 320)/ rmd + 'px';
    document.body.removeChild(div);
    }
    // Abort if browser does not support addEventListener
    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt, recalc, false);
    doc.addEventListener('DOMContentLoaded', recalc, false);
  • 相关阅读:
    20 模块之 re subprocess
    19 模块之shelve xml haslib configparser
    18 包 ,logging模块使用
    vue项目的搭建使用
    课程模块表结构
    DRF分页组件
    Django ContentType组件
    跨域
    解析器和渲染器
    DRF 权限 频率
  • 原文地址:https://www.cnblogs.com/dreamless/p/6093034.html
Copyright © 2011-2022 走看看