• 豌豆资源网
  • 开引网企业服务
  • 服务外包网
  • H5禁止微信内置浏览器调整字体大小

    微信webview内置了调整字体大小的功能,用户可以根据实际情况进行调节。但是这也会导致字体大小改变以后,出现页面布局错乱的情况。

     

    1、iOS的解决方案是覆盖掉微信的样式:

    1 body { /* IOS禁止微信调整字体大小 */
    2     -webkit-text-size-adjust: 100% !important;
    3     text-size-adjust: 100% !important;
    4     -moz-text-size-adjust: 100% !important;
    5 }

     

     

     

    2、安卓手机禁止微信客户端修改字体大小:

     1 <script>
     2        (function() {
     3            if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
     4                handleFontSize();
     5            } else {
     6                if (document.addEventListener) {
     7                    document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
     8                } else if (document.attachEvent) {
     9                    document.attachEvent("WeixinJSBridgeReady", handleFontSize);
    10                    document.attachEvent("onWeixinJSBridgeReady", handleFontSize);  }
    11            }
    12            function handleFontSize() {
    13                // 设置网页字体为默认大小
    14                WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
    15                // 重写设置网页字体大小的事件
    16                WeixinJSBridge.on('menu:setfont', function() {
    17                    WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
    18                });
    19            }
    20        })();
    21 </script>
    22 <!-- 强制禁止用户修改微信客户端的字体大小---end--- -->

     

     

     

     

    posted @ 2020-06-08 17:04  前端一点红  阅读(1670)  评论(0编辑  收藏  举报
  • 乐游资源网
  • 热爱资源网
  • 灵活用工代发薪平台
  • 企服知识
  • 355软件知识