锐客网

  1. 首页 > 睿知 > it技术 > >

安卓4.0下rem显示不正常的问题

IT知识不正常显示不正常显示

登山则情满于山，观海则意溢于海。这篇文章主要讲述安卓4.0下rem显示不正常的问题相关的知识，希望能为你提供帮助。
【安卓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);




























    推荐阅读


    上一篇：Android布局6大类

    下一篇：Android tools:context=".MainActivity"的作用