介绍:
一个rem的计算方法,根据750版设计稿计算。1rem = 100px
代码:
(function (documents, windows) {
var domElement = documents.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
setRem = function () {
var clientWidth = domElement.clientWidth;//获取窗口宽度
if (!clientWidth) return;
//大于750,则给最大100px
if (clientWidth >= 750) {
domElement.style.fontSize = '100px';
} else {
//小于750,则根据750的基数*100,给字体大小
domElement.style.fontSize = 100 * (clientWidth / 750) + 'px';
}
};
if (!documents.addEventListener) return;
setRem();
//监听窗口变化,设置document的字体带下
windows.addEventListener(resizeEvt, setRem, false);
documents.addEventListener('DOMContentLoaded', setRem, false);
})(document, window);
第二种:
(function (win) {
resizeRoot();
function resizeRoot() {
var wWidth = document.documentElement.clientWidth;
if (wWidth > 640) wWidth = 640;
else if (wWidth <320) wWidth = 320;
document.documentElement.style.fontSize = wWidth / 7.5 + 'px';
}
window.onresize = resizeRoot;
})(window);