Use rem to make mobile pages. During the testing phase, there was no problem. On IOS, Android and other mobile phones, everything was perfect.
However, when opening the page with the browser that comes with the oppo phone, rem failed, and only the height of the picture failed. , all the pictures have been elongated.
why is that?
This is the JavaScript code that controls rem
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (clientWidth > 640){
docEl.style.fontSize = 100 + 'px';
}else {
docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
}
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
Because the technical strength of a small manufacturer like Oppo is not good, and the built-in browser kernel version is too low