h5-微信浏览器使用字体放大时候出现布局错乱问题

797 阅读1分钟

在微信浏览器中使用放大字体会出现字体放大,但是布局会错误问题:

image.png

解决: 限制打小,不允许用户放大:

//android禁止微信浏览器调整字体大小
if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
  handleFontSize();
} else {
  if (document.addEventListener) {
      document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
  } else if (document.attachEvent) {
      document.attachEvent("WeixinJSBridgeReady", handleFontSize);
      document.attachEvent("onWeixinJSBridgeReady", handleFontSize);  }
}
function handleFontSize() {
  // 设置网页字体为默认大小
  WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
  // 重写设置网页字体大小的事件
  WeixinJSBridge.on('menu:setfont', function() {
      WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
  });
}