例如这样

然后这样

出现这样的原因一般是   静态的，即html里有一些静态的（即非js动态添加的）

如果在页面加载完成后，页面是用js动态添加的，这个问题就不太明显，

doc.addEventListener('DOMContentLoaded', function(e) {

            doc.body.style.fontSize = 12 * dpr + 'px';

        }, false);

这段代码是起主要作用的，但是这段代码是在页面初始化完毕才执行的（即把把其他引用的js文件下载好，并且里面的函数都初始完成），

这样，在页面加载的一瞬间，我们会看到页面先先放大的，不解释了，太晚了，直接说解决方案把。

refreshRem();

    //doc.body.style.fontSize = 12 * dpr + 'px';

    flexible.dpr = win.dpr = dpr;

    flexible.refreshRem = refreshRem;

1.在  refreshRem();后面加上doc.body.style.fontSize = 12 * dpr + 'px';这段代码，

2.

<body>

<script type="text/javascript" src="js/lib/flexible_css.js" ></script>

  <script type="text/javascript" src="js/lib/flexible.js" ></script>

把这两个js放在body的头部（），一定要放在这里，

不然 doc.body.style.fontSize = 12 * dpr + 'px';  我们加的这段代码会报错，原因是可能是页面还没有body元素


最后ps一句：这个方案的原理就是在body刚加载完就计算fontsize，这样修改的会不会对其他方面就影响我还不太清楚，请懂得同学，告诉一下，谢谢

解决手淘lib-flexible.js在移动端首次加载页面页面先放大后正常问题的更多相关文章

  1. JS判断访问设备(userAgent)加载不同页面 JS判断客户端操作系统类型(platform)

    //平台.设备和操作系统 var system ={ win : false, mac : false, xll : false }; //检测平台 var p = navigator.platfor ...

  2. 解决移动端rem加载瞬间页面错乱的方法（放大或者缩小）

    移动端布局有很多种,这里我们最常使用到rem+百分比的布局方式(高度/字体设置rem单位,宽度设置百分比)来处理屏幕兼容,这种方法在兼容上是比较不错的,可以使得字体以及整体适应各种大小的屏幕,可以解决 ...

  3. js引入php 用来加载静态页面 输出到页面中

    HTML页面中加入代码 <script type="text/javascript" src="http://www.域名.com/js.php?id=tjyd&q ...

  4. 手淘的flexible.js解决手机适配问题

    如何使用flexible.js做手机适配 做移动端网页肯定需要做适配,以前都用的fixscreen.js,对比一下,觉得flexible.js更好吧,毕竟是大厂出的东西. 第一步要给页面加在viewp ...

  5. js实现移动端无限加载分页

    原理:当滚动条到达底部时,执行下一页内容. 判断条件需要理解三个概念:    1.scrollHeight 真实内容的高度    2.clientHeight 视窗的高度,即在浏览器中所能看到的内容的 ...

  6. JqueryEasyUI 解决IE下加载时页面错乱的问题 分类： JavaScript JqueryEasyUI 2014-09-20 09:50 545人阅读 评论(1) 收藏

    问题描述: 一直觉得jqueryeasyui在IE下的渲染效果不大好,尤其刚进入页面时的加载,页面会出现布局错乱,虽然是一闪而过,但是给用户的体验不好: 可以通过在页面onload时,增加一个遮罩层, ...

  7. 解决父类加载iframe，src参数过大导致加载失败

    原文:解决父类加载iframe,src参数过大导致加载失败 <iframe src="*******.do?param=****" id="leftFrame&qu ...

  8. js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面

    js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面 , 做手机端开发时,发现一个问题,有些浏览器,在网速比较慢的情况下,js文件没有加载完,后续的调用已经开始调用了, ...

  9. Angular.JS + Require.JS + angular-async-loader 来实现异步加载 angular 模块

    传统的 angular 应用不支持异步加载模块,必须在 module 启动的时候,所有模块必须预加载进来. 通过使用 angular-async-loader 库,我们可以使用 requirejs 等 ...

随机推荐

  1. Mac 10.10 配置apache

    配置php 命令行工具:http://blog.csdn.net/evane1890/article/details/38759073 自从系统从OS X Mavericks 10.9升级到OS X  ...

  2. Python的3种格式化字符串方法

    Python中有3种format字符串的方式: 传统C语言式 命名参数 位置参数 1. 传统C语言式 和c语言里面的 sprintf 类似,参数格式也一样 title = "world&qu ...

  3. [Go]结构体及其方法

    结构体类型可以包含若干字段,每个字段通常都需要有确切的名字和类型.也可以不包含任何字段,这样并不是没有意义的,因为还可以为这些类型关联上一些方法,这里可以把方法看作事函数的特殊版本. 函数事独立的程序 ...

  4. CSU 1605 数独

    题目大意: 9宫格每个位置都有对应的分数,填完数独后根据对应位置的分数相加之和求个最大值,不存在输出-1 说什么用位运算加速可以解决问题,但是对着标程还是T,最近学了dlx,发现这样解决数独快了很多 ...

  5. BZOJ 2561: 最小生成树【最小割/最大流】

    Description 给定一个边带正权的连通无向图G=(V,E),其中N=|V|,M=|E|,N个点从1到N依次编号,给定三个正整数u,v,和L (u≠v),假设现在加入一条边权为L的边(u,v), ...

  6. hdu 5188 zhx and contest [ 排序 + 背包 ]

    传送门 zhx and contest Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Othe ...

  7. Linux查看日志三种命令（转载）

    第一种:查看实时变化的日志(比较吃内存) 最常用的: tail -f filename (默认最后10行,相当于增加参数 -n 10) Ctrl+c 是退出tail命令 其他情况: tail -n 2 ...

  8. 关于Java第一次实验的对课后问题自己的理解--验证码实现及其四则运算

    问题一.对于课上ppt中EnumTest所提出的的问题进行解答 将这段代码放到文件中进行运行后发现 1.对应的Size中不同元素的并不是同一个对象 2.以其中一个枚举类型s来说,不是原始数据,即他们都 ...

  9. Spring事务管理概述

    以下内容引用自http://wiki.jikexueyuan.com/project/spring/transaction-management.html: 数据库事务是一个被视为单一的工作单元的操作 ...

  10. WinCE5.0如何安装.NET3.5

    首先去微软官网下载.NET Compact Framework 3.5 Redistributable 点击下载 下载页面 一共有两种安装方式,我们先介绍常规的安装方式 1.设备连接到电脑,然后双击下 ...