微信字体大小调整导致的H5页面错乱问题处理

2023-03-10,,

当用户调整微信字体大小时会导致H5页面错乱,解决方案如下:

ios:在css中加入-webkit-text-size-adjust: 100% !important;

     

    body {

     

    -webkit-text-size-adjust: 100% !important;

     

    }

安卓:借助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 });

     

    });

     

    }

     

    })();

 

 

微信字体大小调整导致的H5页面错乱问题处理的相关教程结束。

《微信字体大小调整导致的H5页面错乱问题处理.doc》

下载本文的Word格式文档,以方便收藏与打印。