微信关怀模式下字体优化

47 阅读1分钟

在微信关怀模式下,图片没有放大,字体被放大了,导致页面显示不错误。 可以在index.html中加入下面的代码解决字体被放大的问题。

    <style>
      body {
        -webkit-text-size-adjust: 100% !important;
        text-size-adjust: 100% !important;
      }
    </style>
    
      <script>
      (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 });
          });
        }
      })();
    </script>