落地页不同手机的诡异表现

[PeterChen1997]

表现

落地页在不同手机上出现不同的表现

调查

发现chrome调试的渲染字体大小与实际的font-size不一，搜索发现是由于系统字体放大导致的

解决

< script >
var systemFontSizeAdjustDiv = document.createElement("div");

systemFontSizeAdjustDiv.innerHTML = '<div class="fontsize-adjust" style="width:100%;height:100rem;position:fixed;visibility:hidden;"></div>'

document.body.appendChild(systemFontSizeAdjustDiv);

var testDiv = document.querySelector(".fontsize-adjust"),
currentHeight = testDiv.offsetHeight,
currentFontSize = document.querySelector("html").style.fontSize.slice(0, -2),
originHeight = 100 * document.querySelector("html").style.fontSize.slice(0, -2),

magnifyingTimes = currentHeight / originHeight;

document.querySelector("html").style.fontSize = currentFontSize / magnifyingTimes + "px",
document.body.removeChild(testDiv.parentNode); 
< /script>

[PeterChen1997]

https://github.com/amfe/lib-flexible/pull/79/files

[PeterChen1997]

自己的包：https://github.com/PeterChen1997/lib-flexible-fix