在项目中使用了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);

安卓4.0下rem显示不正常的问题的更多相关文章

  1. Google Nexus5在linux下刷原生安卓 android6.0

    之前将Nexus5刷成了MIUI系统,现在想体验一下安卓6.0,网上都是windows的教程,但如何在linux下刷机呢? 首先准备环境和工具: 1. 我的linux系统是lubuntu 15.10 ...

  2. 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新

    在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...

  3. 还在期待安卓9.0吗?Android 10.0要来了

    目前,美国 Google公司的 AndroidP (安卓9.0),已经正式全面推出有几个多月了.众多手机品牌厂商也都在积极的进行更新适配 Android 9.0 系统(修改UI界面也算是二次开发,嗯) ...

  4. 关于安卓6.0权限申请 PermissionDog

    最近在一家公司实习,项目中需要用到适配安卓6.0以上的系统,我本来是想用其他人已经写好的权限申请框架来实现的,但是发现跟我的需求有点小区别,所以就自己写了一个 这个权限申请的帮助类很小,只有一个jav ...

  5. JFreechart在linux下不显示及中文乱码问题

    一.使用JFreeChart建的报表,在window下能正常显示,但是放到linux下就报错,而且有时候会把tomcat挂掉, 原因是jfreechart的在linux系统中需要访问java awt库 ...

  6. css 图片内容在不同分辨率下居中显示(演示的图片宽度是1920px,当图片宽度大于显示屏的宽度时)

    1.img 图片内容在不同分辨率下居中显示(如果隐藏多余,在img外面套一个div  设定overflow: hidden.div的大小就是img显示区域的大小) <!DOCTYPE html& ...

  7. Discuz 7.0版块横排显示版块图标和版块简介的方法

    Discuz 7.0版块横排显示版块图标和版块简介的方法 最近很多朋友咨询Discuz论坛设置论坛版块横排后,如何设置显示版块图标和简介的问题. 一.显示板块图标 找到templates\defaul ...

  8. JQuery 简单的文字超出部分隐藏下拉显示

    HTML代码: <body> <div class="txt_bos"><!--在每一个放置文字的class外面包一个div,以便设置动画样式用,同样 ...

  9. qt如何实现一个渐隐窗口呢(开启的时候他是从上往下渐渐显示)

    qt如何实现一个渐隐窗口呢?就是比如说开启的时候他是从上往下渐渐显示的,关闭的时候从下往上渐渐小时的http://stackoverflow.com/questions/19087822/how-to ...

随机推荐

  1. WPF 之 布局(二)

    一.Canvas  Canvas是最基本的面板,只是一个存储控件的容器,它不会自动调整内部元素的排列及大小,它仅支持用显式坐标定位控件,它也允许指定相对任何角的坐标,而不仅仅是左上角.可以使用Left ...

  2. 通过GCD、NSOperationQueue队列、NSThread三种方法来创建多线程

    #import "ViewController.h" @interface ViewController () @property (weak, nonatomic) IBOutl ...

  3. js兼容性问题

    javscript 浏览器兼容性问题: scrollTop = document.documentElement.scrollTop || document.body.scrollTop; scrol ...

  4. iOS中通知中心NSNotificationCenter应用总结

    通知中心(NSNotificationCenter)实际是在程序内部提供了一种广播机制.把接收到的消息,根据内部的消息转发表,将消息转发给需要的对象.这句话其实已经很明显的告诉我们要如何使用通知了.第 ...

  5. android基础学习之布局

    我学习android第一步接触的就是布局的学习.布局是androidUI的基础,是重中之重.总的来说android有6种布局,分别是线性布局LinearLayout.相对布局RelativeLayou ...

  6. IE浏览器部分版本不支持opacity透明度属性问题

    半透明部分设置样式:opacity:0.7在ie9/ie10/ff/chrome/opera/safari显示正常. 但是这样在ie6-ie8中是不支持的,需要加上下面这句话: filter: pro ...

  7. POJ 3660 Cow Contest (闭包传递)

    Cow Contest Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7690   Accepted: 4288 Descr ...

  8. mysql 自增序列(转)

    1:原理是在建立一个触发器TRIGGER tri_NewBH  在table插入时执行序列计算 mysql),content ),`date` DATETIME,val INT); Query OK, ...

  9. javascript面向对象的理解(一)

    第一次在园子发文: 关于js面向对象的理解: 工厂方式是什么?构造函数是什么?原形链?对象的引用? 1.对象是什么? 在js接触的比较多的就是对象了,比如: var arr = []; arr.num ...

  10. git and github学习笔记

    1.git的状态分为working status,stage status和commit status.git diff查看的是working status和 stage status之间的不同,gi ...