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

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

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

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

<script>
(function() {
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 });
});
}
})();
</script>
<!-- 强制禁止用户修改微信客户端的字体大小---end--- -->

H5禁止微信内置浏览器调整字体大小的更多相关文章

  1. h5 禁止微信内置浏览器调整字体大小方法

    ios 通过重写样式控制 body { -webkit-text-size-adjust:100%!important; } android 通过重写事件控制 (function() { if (ty ...

  2. 【前端开发】禁止微信内置浏览器调整字体大小的方法js

    微信webview内置了调整字体大小的功能,用户可以根据实际情况进行调节.但是很多移动端页面的开发都是使用rem作为单位的,字体大小改变以后,会出现页面布局错乱的情况,因此希望能够禁止微信的字体放大功 ...

  3. js-禁止微信内置浏览器调整字体大小

    js方法: (function(){      if(typeof WeixinJSBridge=="object"&& typeof WeixinJSBridge ...

  4. 微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法(转)

    最近在做微信公众号的内嵌页面,发现点击输入框时键盘盖住文本框,找到一段代码解决了这个问题. iOS和android手机都已亲测,需要的可以直接拷贝到代码中使用. js代码如下: $(function ...

  5. 微信内置浏览器WebApp开发,踩坑 · Issue #31 · maxzhang/maxzhang.github.com · GitHub

    最近花6天时间完成了一个七夕的小活动,是一个简单的WebApp.由于我前期对面向微信的Web开发评估不足,导致开发过程十分艰难.写这篇文章总结下,惊醒自己未来不要再犯这样的错误. 问题: 1. 有些比 ...

  6. 微信内置浏览器的JsAPI(WeixinJSBridge续)[转载]

    原文地址:  http://www.baidufe.com/item/f07a3be0b23b4c9606bb.html 之前有写过几篇关于微信内置浏览器(WebView)中特有的Javascript ...

  7. 微信内置浏览器的JsAPI(WeixinJSBridge续)_Alien的笔记

    微信内置浏览器的JsAPI(WeixinJSBridge续)_Alien的笔记 微信内置浏览器的JsAPI(WeixinJSBridge续)进入全屏 之前有写过几篇关于微信内置浏览器(WebView) ...

  8. js判断微信内置浏览器

    做了一个h5页面来下载app,但如果页面是用微信扫一扫打开的,点击下载按钮下载不了app,原因是微信内置浏览器屏蔽了下载链接.所以增加了检测,如果用户是用微信浏览器打开的,则提示用户使用浏览器打开.那 ...

  9. 2017年05月10日记一次微项目投产 | 安卓版微信内置浏览器不能解析gzip压缩过的mp4视频的问题

    前言 今天投产了一个小项目,一个很简单的H5,有播放视频功能,使用了videojs插件. 之前也做过数个视频播放,视频的转压都按照既定流程进行,文件放到FTP后,iphone和安卓机测试下来都没有问题 ...

随机推荐

  1. OAuth2.0系列之基本概念和运作流程(一)

    @ 目录 一.OAuth2.0是什么? 1.1 OAuth2.0简介 1.2 OAuth2.0官方文档 二.OAuth2.0原理 2.1 OAuth2.0流程图 三. OAuth2.0的角色 四.OA ...

  2. linux init.d启动停止脚本

    /etc/init.d/httpd status /etc/init.d/nginx status /etc/init.d/postgresql start linux快捷启动

  3. vue cli3 创建的项目中eslint 配置 问题的解决

    1--   vue cli3 项目文件结构 2-- 注释问题 在eslintrc.js 文件中,将 '@vue/standard' 注释后重启即可: 3-- 配置 eslint 文件 在 vue-cl ...

  4. SpringCloud多数据源实现

    1.枚举多数据源-定义一一对应变量 /** * * 列出所有的数据源key(常用数据库名称来命名) * 注意: * 1)这里数据源与数据库是一对一的 * 2)DatabaseType中的变量名称就是数 ...

  5. 阻塞队列一——java中的阻塞队列

    目录 阻塞队列简介:介绍阻塞队列的特性与应用场景 java中的阻塞队列:介绍java中实现的供开发者使用的阻塞队列 BlockQueue中方法:介绍阻塞队列的API接口 阻塞队列的实现原理:具体的例子 ...

  6. go 语言中windows Linux 交叉编译

    记录一下. 在windows系统编译,然后再Linux系统运行. 在项目目录下运行: 命令: set GOARM=5 set GOARCH=arm set GOOS=linux go build xx ...

  7. Trouble and solution

    Prevent the CTRL from rebooting in loop killall scm watch echo 1 > /dev/watchdog& Install Git ...

  8. show and hide. xp扩展名

    reg add "HKCU\Software\Microsoft\Windows\CurrentVersion\Explorer\Advanced" /v HideFileExt ...

  9. SFTP协议生成公共秘钥文件

    [步骤] 1 ssh方式登录服务器 2 执行命令生成秘钥对 ssh-keygen -t rsa 然后给秘钥文件命名 3.查看当前目录的.ssh目录是否有authorized_keys文件 如果有则把新 ...

  10. NodeJs将异步方法改为同步以上传文件为例

    [本文版权归微信公众号"代码艺术"(ID:onblog)所有,若是转载请务必保留本段原创声明,违者必究.若是文章有不足之处,欢迎关注微信公众号私信与我进行交流!] 下面这个例子既写 ...