根据html的font-size使用rem来优化移动端页面

(function () {
var w = window,
d = document.documentElement,
t;
var refreshRem = function () {
var c = d.clientWidth;
if (!c) {
return;
}
var z = 100 * (c / 375);
z = z >= 144 ? 144 : z;
d.style.fontSize = z + "px";
};
w.addEventListener("resize", function () {
t && clearTimeout(t);
t = setTimeout(refreshRem, 300);
}, false);
w.addEventListener("pageshow", function (p) {
if(p.persisted) { // 页面是否有缓存
t && clearTimeout(t);
t = setTimeout(refreshRem, 300);
}
}, false);
refreshRem();
})();

根据设备width(375)动态设置font-size的更多相关文章

  1. 根据设备宽高动态设置View的大小

    得到设备屏幕宽高: WindowManager wManager = (WindowManager)context.getSystemService(Context.WINDOW_SERVICE); ...

  2. 以rem为单位根据移动设备的分辨率动态设置font-size

    无需指定font-size的大小 <script> // //- 设置根元素fontSize~ // (function (doc, win) { // var _root = doc.d ...

  3. XE6 c++builder 设置 font size GetPropInfo SetOrdProp

    PPropInfo ppi; PTypeInfo pti; TTypeKinds ttk; TRttiContext context; TRttiType *rttiType TObject* obj ...

  4. js动态设置根元素的rem方案

    方案需求: rem 单位在做移动端的h5开发的时候是最经常使用的单位.为解决自适应的问题,我们需要动态的给文档的根节点添加font-size 值. 使用mediaquery 可以解决这个问题,但是每一 ...

  5. GetPropInfo Font Size

    设置font size,遍历所有控件,有的控件没有font属性,所以要用GetPropInfo判断 if (GetPropInfo(cmp, "font")) function G ...

  6. android实现界面左右滑动(GridView动态设置item,支持每个item按某个属性排序来显示在不同的界面)

    效果图 :                         分别是第一页.第二页.第三页,随手截的图,不整齐,勿见怪.开始走了弯路,废了不少时间. 思路如下: 1.用ViewPager实现左右分页滑动 ...

  7. 移动端rem,scale动态设置

    pt:物理像素(电容屏上像素块个数) px:逻辑像素.设备独立像素 高清屏:1px = 4pt 普通屏:1px = 1pt dpr:设备像素比:(某一方向上)物理像素/逻辑像素 通常设置1rem=屏幕 ...

  8. Cocos Creator 动态设置Canvas的宽度与高度,更改适配

    let c = this.node.getComponent(cc.Canvas);c.fitHeight = true;c.fitWidth = false; let h = 960 * cc.wi ...

  9. android屏幕适配的全攻略3-动态获取手机屏幕宽高及动态设置控件宽高

    1.获取手机屏幕宽高: DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetr ...

随机推荐

  1. Mysql基本代码操作

    Mysql的基本代码生成操作 创建一个数据库   (myschool是数据库名) create database myschool; 删除数据库 drop database myschool 创建一个 ...

  2. 发送ajax步骤

    1.创建异步对象  一般命名为xhr     var xhr = new XMLHttpRequest();   2. 设置请求行 open(请求方式,请求url)     1.get 需要在url后 ...

  3. jQuery案例2

    $(this).index用来获取取到的所有元素的序号 省市联动 <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xh ...

  4. 虚拟机安装精简版centos7过程

    虚拟机配置工作如下所示 1.创建虚拟机  使用键盘组合键CTRL+N2.选择自定义(高级) 如图所示: 3.默认如何所示: 4.选择 稍后安装操作系统 如图所示: 5.选择对应的操作系统 如何所示 6 ...

  5. ArcEngine 调用GP里面的Merge工具

    这两天,为ArcEngine中的Merge工具的调试伤头脑筋,明明很简单的事情,就是搞不掂儿.今天忽然想到是否是中文的关系,果然,把中文修改成英文成功了.真是快郁闷死了! public static ...

  6. HTML5 video 播放视频黑屏

    <video width="320" height="240" controls>        <source src="movi ...

  7. 浏览器打开aspx文件 ,提示:XML 解析错误:找不到根元素

    在使用VS2013这个IDE创建aspx文件后,在浏览器打开后居然发现了以下错误:XML 解析错误:找不到根元素         详细查看里面的信息,发现了这么一个链接位置:http://localh ...

  8. 恢复Windows 10自带的微软正黑字体

    突然发现  在word中 Microsoft JhengHei 字体没有了,一查在C:\windows\fonts\msjh.ttc文件还在. Windows Registry Editor Vers ...

  9. windows 8.1 启用hyper-v导致vmware 无法使用的问题解决方案(兼顾WP8.1模拟器和vmware)

    最近搭建了windows phone 8.1开发环境,为了开机就可以进行WP8.1开发,就使用了 bcdedit /set {BCD ID} hypervisorlaunchtype auto 命令将 ...

  10. 0002-小牛学堂大数据24期视频-架构Hadoop-Spark