当用户调整微信字体大小时会导致H5页面错乱,解决方案如下:
ios:在css中加入-webkit-text-size-adjust: 100% !important;
-
body {
-
-webkit-text-size-adjust: 100%
-
}
安卓:借助WeixinJSBridge对象来阻止字体大小调整,将此段代码放在在程序的入口页面(例如 index.html / index.ejs等)即可
-
(function () {
-
if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
-
handleFontSize();
-
} else {
-
document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
-
}
-
function handleFontSize () {
-
// 设置网页字体为默认大小
-
WeixinJSBridge.invoke(‘setFontSizeCallback‘, { ‘fontSize‘ : 0 });
-
// 重写设置网页字体大小的事件
-
WeixinJSBridge.on(‘menu:setfont‘, function() {
-
WeixinJSBridge.invoke(‘setFontSizeCallback‘, { ‘fontSize‘ : 0 });
-
});
-
}
-
})();