//设置根元素字体
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. Netty 系列之 Netty 高性能之道

    1. 背景 1.1. 惊人的性能数据 最近一个圈内朋友通过私信告诉我,通过使用 Netty4 + Thrift 压缩二进制编解码技术,他们实现了 10 W TPS(1 K 的复杂 POJO 对象)的跨 ...

  2. docker develop django

    $ docker pull django $ docker run -it -v $(pwd):/usr/src/app -p 8000:8000 django /bin/bash

  3. DOG检测

    共享一个代码算了,太忙鸟,有时间在补充. function [] = dog_learn() img = imread('/Users/img/lena.png'); img = rgb2gray(i ...

  4. CSS--background

    它的组合写法: background-color, background-image, background-repeat,backgroundattachment, background-posit ...

  5. redis技巧--自动完成功能实现

    自动完成功能一般都伴随搜索框出现,就是用户在输入时帮助其自动补全. 比如对成语进行补全,现有如下成语:一心一意,一心二用,一帆风顺. 两种实现方式: 实现方式一: 为每个成语的每个前缀都使用一个集合类 ...

  6. Gradle Maven 依赖管理

    仓库管理简介 本质上说,仓库是一种存放依赖的容器,每一个项目都具备一个或多个仓库. Gradle支持以下仓库格式: Ivy仓库 Maven仓库 Flat directory仓库 我们来看一下,对于每一 ...

  7. java实现二叉树

    栈在遍历的时候不能使用for循环,因为他的size函数在动态变小.

  8. 小小C程序(九九乘法表)

    用一个简单的嵌套循环实现: #include <stdio.h> int main() { int i,j; ,j=i;i<=&&j<=;) { if (i== ...

  9. 推荐一些国内的Jquery CDN免费服务

    Jquery是个非常流行的JS前端框架,在很多网站都能看到它的身影.很多网站都喜欢采用一些Jquery CDN加速服务,这样网站加载jquery会更快.之前火端网络的一些网站都是使用Google的jq ...

  10. 玩QQ游戏,见到好几个图像是美女的QQ,就不始玩

    玩QQ游戏,见到好几个图像是美女的QQ,光占坑就是不开始玩 加了一个,发现是传播不良网站的QQ 聊天还是自动的 估计是利用webqq写的程序,也就那几句话来回重复,让你去注册网站什么 可以加这个Q去体 ...