40 lines
941 B
JavaScript
40 lines
941 B
JavaScript
/**
|
|
* 动态设置rem
|
|
*/
|
|
|
|
var BASE_SIZE = 20; // 基本字体大小
|
|
var MAX_SIZE = 50; // 最大字体大小
|
|
var DESIGN_WIDTH = 720; // iphone 6
|
|
var MIN_DESIGN_WIDTH = 320;
|
|
var htmlEl = document.querySelector('html');
|
|
var fontSize = 20;
|
|
|
|
var setFontSize = function (size) {
|
|
htmlEl.style.fontSize = size + 'px';
|
|
fontSize = size;
|
|
};
|
|
|
|
var calc = function () {
|
|
var device_width = document.body.clientWidth || window.innerWidth;
|
|
var scale = device_width / DESIGN_WIDTH;
|
|
var distSize = scale * BASE_SIZE;
|
|
if (distSize > MAX_SIZE) {
|
|
distSize = MAX_SIZE;
|
|
}
|
|
if (device_width < MIN_DESIGN_WIDTH) return;
|
|
setFontSize(Math.round(distSize));
|
|
};
|
|
|
|
window.addEventListener('resize', calc);
|
|
|
|
document.addEventListener('DOMContentLoaded', calc);
|
|
|
|
window.rem = function (size) {
|
|
return size / BASE_SIZE + 'rem';
|
|
};
|
|
|
|
window.renderPx = function (size) {
|
|
return Math.round((size / BASE_SIZE) * fontSize);
|
|
};
|
|
|