//设置根元素字体
var win = window,
doc = document;
function setFontSize() {
  var winWidth = $(window).width();

  //750这个数字是根据你的设计图的实际大小来的,所以值具体根据设计图的大小
  var size = (winWidth / 750) * 100;
  doc.documentElement.style.fontSize = (size < 100 ? size : 100) + 'px';
};

//这里我们给个定时器来实现页面加载完毕再进行字体设置
setTimeout(function() {
  //初始化
  setFontSize();
}, 100);

Js动态设置rem来实现移动端字体的自适应的更多相关文章

  1. 理解rem实现响应式布局原理及js动态计算rem

    前言 移动端布局中,童鞋们会使用到rem作为css单位进行不同手机屏幕大小上的适配.那么来讲讲rem在其中起的作用和如何动态设置rem的值. 1.什么是rem rem是相对于根元素(html标签)的字 ...

  2. js动态设置padding-top遇到的坑

    我想通过js动态设置元素padding-top的百分比值:以下几种都是无法设置成功的: // setAttribute设置padding-top并且转换为百分比 imageBox.setAttribu ...

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

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

  4. Dynamic CRM 2013学习笔记(二十八)用JS动态设置字段的change事件、必填、禁用以及可见

    我们知道通过界面设置字段的change事件,是否是必填,是否可见非常容易.但有时我们需要动态地根据某些条件来设置,这时有需要通过js来动态地控制了. 下面分别介绍如何用js来动态设置.   一.动态设 ...

  5. js动态设置窗体位置

    1设置登录框的js,动态设置高度等 <script> $(document).ready(function () { $() / + "px"); $("in ...

  6. js动态设置输入框字体/颜色

    动态设置文本框颜色: 主要是利用javascript中的触发事件onfocus和onblur <script language="javascript" type=" ...

  7. 响应式布局(rem布局),使用JS动态设置fontsize

    var cw = document.documentElement.clientWidth; if (cw > 1920) { cw = 1920; } document.getElements ...

  8. JS动态设置css的几种方式

    1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保留 - 号,就中括号的形式  element. ...

  9. js 动态设置键值对数组 ,类似于 java 的Map 类型

    1.前言 我想设置一个数据  var json = {a1 :1  , a2 :2  , a3 :3  .....} 这样的动态数据 ,怎么写呢? 2.正确写法 var json = []; for ...

随机推荐

  1. Delphi 获取时间的年月日

    procedure TFrmLltj.FormActivate(Sender: TObject); var   Present: TDateTime;   Year, Month, Day, Hour ...

  2. highcharts总结

    //tooptip此属性表达的是鼠标移那个位置显示的值 tooptip:{ formatter: function (){ //this.point.name 表达显示名字 //this.x 表达显示 ...

  3. UML大战需求与分析--阅读笔记4

    今天阅读了UML大战需求与分析第五.六章. 第五章,状态机图(State Machine Diagram),状态机图是通过描述某事物状态的改变来展现流程的.一般适用于流程围绕某个事物展开,例如请假的流 ...

  4. p/invoke碎片--对类的封送处理

    主要是看默认封送处理行为 按类成员的类型是否为“可直接传递到非托管内存”的类型来分类;按照成员中是否有“可直接传递到非托管内存”的类型来讨论. 所有成员都是“可直接传递到非托管内存”的类型 托管代码和 ...

  5. Linux 基本命令

    修改环境变量 vim ~/.bashrc 保存退出,输入以下命令使之立即生效 source ~/.bashrc /etc/profile:在登录时,操作系统定制用户环境时使用的第一个文件,此文件为系统 ...

  6. Angular 之坑??

    1. 场景:bootstrap的popup画面中有一个select元素, <select > <option> 1 </option> <option ng- ...

  7. Why did I have a recovery trip

    For more than a decade, I felt most at ease living out of a suitcase, never quite sure where I might ...

  8. 解决svn问题:Wrong committed revision number: -1

    参考:http://my.oschina.net/luckyi/blog/291007

  9. 前端构建工具的用法—grunt、gulp、browserify、webpack

    随着前端项目的飞速发展,项目越来越大.文件越来越多,前端工程化的工具也越来越多.下面介绍目前最流行的四种构建工具——grunt.gulp.browserify.webpack 所有的构建工具都是基于N ...

  10. Linq学习笔记四之linq to sql 的基本操作

    首先需要在项目中新增一个 linq  to sql 的服务 新增项,数据,LINQ TO sql 类的这个方法 第二步需要一个model类,用作映射 [Table] public class S_ZD ...