根据屏幕宽度设置字体大小

<script>
(function (doc, win) {
var rem;
var dpr = win.devicePixelRatio || 1;
var docEl = doc.documentElement;
var initialDeviceWidth = docEl.clientWidth;
var expectRem = initialDeviceWidth / 375 * 20;

function setRemUnit() {
var fontSizeDetect = document.getElementById(‘fontSizeDetect’);
var currentDeviceWith = docEl.clientWidth;
var newRem;
if (fontSizeDetect && initialDeviceWidth === currentDeviceWith && win.navigator.userAgent.match(/Android/)) {
// 解决安卓缩放字号引起的页面错乱 bug
var renderDetectionSize = parseFloat(window.getComputedStyle(fontSizeDetect).fontSize);
if (Math.abs(expectRem – renderDetectionSize) > 2) {
var currentRem = parseFloat(docEl.style.fontSize) || expectRem;
newRem = currentRem * (expectRem / renderDetectionSize);
newRem = newRem.toFixed(1);
}
} else {
newRem = expectRem;
initialDeviceWidth = currentDeviceWith;
}

if (newRem && parseFloat(docEl.style.fontSize) !== newRem) {
rem = newRem;
docEl.style.fontSize = rem + ‘px’;
win.rem = rem;
}
requestAnimationFrame(setRemUnit);
}

setRemUnit();
})(document, window);
</script>


发表评论

电子邮件地址不会被公开。 必填项已用*标注