(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = document.body.clientWidth;
if (!clientWidth)
return;
docEl.style.fontSize = 100 * (clientWidth / 360) + 'px';
}; if (!doc.addEventListener)
return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false); })(document, window); 或
document.documentElement.style.fontSize=20*document.documentElement.clientWidth/640+'px';

  

设计图字体除以20、640参数随设计图宽度做相应变化

  

移动端rem处理字体的js代码的更多相关文章

  1. 一文了解服务端推送(含JS代码示例)

    常用的服务端推送技术,包括轮询.长轮询.websocket.server-sent-event(SSE) 传统的HTTP请求是由客户端发送一个request,服务端返回对应response,所以当服务 ...

  2. 移动端rem与px适应js

    方法一: (function (doc, win) { var docEl = doc.documentElement, resizeEvt = "orientationchange&quo ...

  3. 一看就懂得移动端rem布局、rem如何换算

    这里使用了js控制根元素的font-size大小,然后进行rem换算,在js代码后面会说明以下问题. 1.如何进行rem运算? 2.如果纯js控制根元素用rem布局会出现的小问题,如何解决? 3.如有 ...

  4. 如何在 js 代码中使用 jsp 标签或 Java 代码

    JSP 标签还是很方便的,比如 Struts.Spring 等提供给我们的 JSP 标签,可以用它们来获取变量或进行一些计算.比如 struts2 的 <s:url value="/a ...

  5. 移动端rem.js的使用方法

    下面的代码一是我根据rem的使用经验,自己写的一个rem.js,发现很好用,能适用所有移动端h5页面的自适应需求: 代码一: window.onload = function(){ /*720代表设计 ...

  6. 移动端rem.js使用方法

    下面的代码一是我根据rem的使用经验,自己写的一个rem.js,发现很好用,能适用所有移动端h5页面的自适应需求: 代码一: ``` window.onload = function(){ /*720 ...

  7. 阻止pc端浏览器缩放js代码

    阻止pc端浏览器缩放js代码 众所周知:移动端页面禁止用户缩放界面只需加上<meta name="viewport" content="user-scalable= ...

  8. html页面控制字体大小的js代码

    dom对象控制显示文章字体大小的js代码 <head> <script type="text/javascript"> function check(siz ...

  9. JS学习十四天----server端运行JS代码

    server端运行JS代码 话说,当今不在client使用JS代码才是稀罕事.因为web应用的体验越来越丰富,client用JS实现的逻辑也越来越多,这造成的结果就是某些差点儿一致的逻辑须要在clie ...

随机推荐

  1. Linux:Ubuntu 14.04 Server 离线安装Jjava8(及在线安装)

    (离线安装)首先,通过winscp上传本地下载好的jdk-8u102-linux-x64.gz (离线安装)将jdk-8u102-linux-x64.gz解压到到/usr/lib/jvm下,并把文件夹 ...

  2. 【转】[退役]纪念我的ACM——headacher@XDU

    转自:http://hi.baidu.com/headacher/item/5a2ce1d50609091b20e25022 退役了,是时候总结一下我ACM的生涯了.虽然很舍不得,但这段回忆很值得纪念 ...

  3. 商人过河问题(DFS)

    问题描述:3个商人带着3个仆人过河,过河的工具只有一艘小船,只能同时载两个人过河,包括划船的人.在河的任何一边,只要仆人的数量超过商人的数量,仆人就会联合起来将商人杀死并抢夺其财物,问商人应如何设计过 ...

  4. IOC 控制反转模式

    1.依赖 依赖就是有联系,有地方使用到它就是有依赖它,一个系统不可能完全避免依赖。如果你的一个类或者模块在项目中没有用到它,恭喜你,可以从项目中剔除它或者排除它了,因为没有一个地方会依赖它。下面看一个 ...

  5. Coursera台大机器学习基础课程学习笔记1 -- 机器学习定义及PLA算法

    最近在跟台大的这个课程,觉得不错,想把学习笔记发出来跟大家分享下,有错误希望大家指正. 一机器学习是什么? 感觉和 Tom M. Mitchell的定义几乎一致, A computer program ...

  6. windows环境下Django安装配置

    --python下载 https://www.python.org/downloads/ --pip 下载 https://pypi.python.org/pypi/pip --pip 安装及路径 解 ...

  7. 《zw版·Halcon-delphi系列原创教程》 Halcon分类函数011,ocr,字符识别

    <zw版·Halcon-delphi系列原创教程> Halcon分类函数011,ocr,字符识别 为方便阅读,在不影响说明的前提下,笔者对函数进行了简化: :: 用符号“**”,替换:“p ...

  8. iphone和ipad各控件大小

    ipad和iphone是一样的:

  9. Linux C Programing - Terminal(1)

    #include <stdio.h> //getchar() putchar() printf() gets() puts() sprintf() #include <stdlib. ...

  10. [问题2014A01] 复旦高等代数 I(14级)每周一题(第三教学周)

    [问题2014A01]  试求下列 \(n\) 阶行列式的值: \[ |A|=\begin{vmatrix} 1 & x_1(x_1-a) & x_1^2(x_1-a) & \ ...