(function (doc, win) {
var docEl = doc.documentElement, //html
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', //事件名称
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
if (clientWidth >= 640) {
docEl.style.fontSize = '100px';
}
else {
docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
}
}; if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);

  

移动的rem自适应的更多相关文章

  1. rem自适应布局的回顾总结

    使用rem实现自适应布局,应该算是当前移动前端的一大趋势,有些人对此还有点迷惑,搞不懂rem是如何实现自适应布局,如何根据设计稿来调整rem的值?rem布局如何用雪碧背景图片?rem一定要加载JS吗? ...

  2. 【转载】rem自适应布局-移动端自适应必备

    原文链接:rem自适应布局-移动端自适应必备 版权所有,转载时请注明出处,违者必究. 由于移动端特殊性,本文讲的是如何使用rem实现自适应,或叫rem响应式布局,通过使用一个脚本就可以rem自适应,不 ...

  3. rem自适应js

    Rem自适应js---flexible.min.js   网上看到很多移动端适配的各种方法,由于原来工作中对rem的疏忽,所以决定重新学习rem~ 由于移动端特殊性,本文讲的是如何使用rem实现自适应 ...

  4. 【转】rem自适应布局

    rem自适应原理 rem是根据html的font-size大小来变化,正是基于这个出发,我们可以在每一个设备下根据设备的宽度设置对应的html字号,从而实现了自适应布局.更多介绍请看这篇文章:rem是 ...

  5. rem自适应

    //REM自适应 _resize(); window.addEventListener('resize', _resize, false); function _resize() { var devi ...

  6. Rem自适应js---flexible.min.js

    网上看到很多移动端适配的各种方法,由于原来工作中对rem的疏忽,所以决定重新学习rem~ 由于移动端特殊性,本文讲的是如何使用rem实现自适应,或叫rem响应式布局,通过使用一个脚本就可以rem自适应 ...

  7. rem自适应布局

    rem自适应原理 rem是根据html的font-size大小来变化,正是基于这个出发,我们可以在每一个设备下根据设备的宽度设置对应的html字号,从而实现了自适应布局.更多介绍请看这篇文章:rem是 ...

  8. rem自适应原理

    rem自适应原理 rem是根据html的font-size大小来变化,正是基于这个出发,我们可以在每一个设备下根据设备的宽度设置对应的html字号,从而实现了自适应布局.更多介绍请看这篇文章:rem是 ...

  9. 彻底弄懂设置根元素字体大小calc(100vw/18.75) 实现rem自适应

    rem 是相对文档根元素(html)字体大小的尺寸单位,当元素的尺寸或文字字号等使用 rem 单位时,会随着根元素的 font-size 变化而变化,那么在不同分辨率的设备下动态设置根元素的字体大小就 ...

  10. 通过rem自适应屏幕尺寸

    通过rem自适应屏幕尺寸 常用的前端单位 px px就是pixel的缩写,设备分辨率,物理像素 pt pt就是point的缩写,逻辑分辨率,逻辑像素 em 参考物是父元素的font-size,具有继承 ...

随机推荐

  1. HDU1003前导和

    简单维护前导和 #include<stdio.h> int main() { ],cas,key=; scanf("%d",&cas); while(cas-- ...

  2. oracle创建自增长列

    --创建一个新表 /*create table students(stu_id number,stu_name varchar2(20),stu_email varchar2(40),primary ...

  3. LOTUS 迁移到Exchange 2010 POC 之在Exchange 2007 安装Lotus Admin!

    双击Setup安装:

  4. [置顶] DataGridView控件---绑定数据方法

             DataGridView控件是在windows应用程中显示数据最好的方式,它只需要几行简短的代码就可以把数据显示给用户,同时又支持增.删.改操作.今天将自己总结的增加数据的方法总结分 ...

  5. 图片转换成base64_encode的链接代码示例

    <?php $file = "example.jpg"; $type = getimagesize( $file ); //取得图片的大小,类型等 $file_content ...

  6. Castle 开发系列文章

    转自:http://terrylee.cnblogs.com/archive/2006/04/28/castl_ioc_article.html Castle是针对.NET平台的一个开源项目,从数据访 ...

  7. sql server 2005全角与半角字符转换

    CREATE FUNCTION D_ByteExchangeS_Byte(@str NVARCHAR(4000), --要转换的字符串@flag bit              --转换标志,0转换 ...

  8. 无责任Windows Azure SDK .NET开发入门篇二[使用Azure AD 进行身份验证-2.2身份验证开发]

    2.2身份验证开发 在我们的案例中,我们是用户通过Web应用程序进行身份识别. 上面的图示说明了如下的一些概念 l Azure AD 是标识提供程序,负责对组织的目录中存在的用户和应用程序的标识进行验 ...

  9. typeof与GetType区别及反射的见解

    http://www.cnblogs.com/knowledgesea/archive/2013/03/02/2935920.html http://www.cnblogs.com/Jax/archi ...

  10. C#.Net中的非托管代码清理

    帮助其它项目组Review代码过程,发现有些地方实现了IDispose接口,同时也发现了一些关于IDispose的问题: 1.A类型实现了IDispose接口,B类型里面含有A类型的字段,B类型没有实 ...