rem布局js设置,设置网页文档参考字体闭包函数
(function (doc, win) {
var docEl = doc.documentElement,
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);
宽640的设计稿,这样设置后,10px相当于0.1rem 100px相当于1rem 1:100的关系
rem布局js设置,设置网页文档参考字体闭包函数的更多相关文章
- jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档。
jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档. jquery.cookie中的操作: jquery.cookie.js是一个基于jquer ...
- JS第二部分--DOM文档对象模型
一.DOM的概念 二.DOM可以做什么 三.DOM对象的获取 四.事件的介绍 五.DOM节点标签样式属性的操作 六.DOM节点对象对值的操作 七.DOM节点-标签属性的操作(例如id class sr ...
- Babylon.js官方性能优化文档中文翻译
在这里列出Babylon.js官方性能优化文档的中英文对照,并在CardSimulate项目里对其中的一些优化方法进行实践. How To 如何 Optimize your scene 优化你的场景 ...
- js/css在html文档中的引用外部文件方式对比
包含css样式表和js脚本的最好方式是使用外部文件,因为css/js和html标记文档可以清晰地分离. css的外部引用写在<head></head>中: <head&g ...
- jQuery+turn.js翻书、文档和杂志3种特效演示
很好用的一款插件jQuery+turn.js翻书.文档和杂志3种特效演示 在线预览 下载地址 实例代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...
- 获取网页文档的URL和连接来源
<script type="text/javascript">document.write("链接来源:"+document.referrer+&q ...
- 《网页文档/文字复制方法大全》 - imsoft.cnblogs
<网页文档/文字复制方法大全> 一: 1.首先,找到自己要的文档. 2.文章题目复制,在搜索引擎的框框里输入:site:wenku.baidu.com "题目"/sit ...
- HTML5网页文档结构
2.1 Web标准 Web标准,使得Web开发更加容易.Web标准由万维网联盟(W3C)制定. 2.1.1 Web标准概述 Web标准的最终目的就是保证每个人都有权力访问相同 ...
- GitBook的使用方式,快速创建网页文档
环境需求:node npm 得装好 ----------------------------------- 我一开始不知道得先装gitbook-cli 先执行了 npm install gitbook ...
随机推荐
- exiting pxe rom 无法启动
背景 我这是给人装了多少次机器了,上千次不敢说,几百次是有了.有个奇怪现象,为什么每次总有新的问题呢,极少能一次成功的.除了让我涨了见识,没想到其他的用处.程序员修电脑,搞笑吧,还有找我修洗衣机的,说 ...
- Vue 核心之数据劫持
前端界空前繁荣,各种框架横空出世,包括各类mvvm框架横行霸道,比如Angular.Regular.Vue.React等等,它们最大的优点就是可以实现数据绑定,再也不需要手动进行DOM操作了,它们实现 ...
- Selenium+Java自动化之如何优雅绕过验证码
前言: 验证码问题对于每个ui自动化的同学而言,相信都是个蛋疼的问题,对于验证码的处理我个人不提倡破解,不要去想破解方法,这个验证码本来就是为了防止别人自动化登录的.如果你们公司的验证码很容易被你破解 ...
- 解决log4j和self4j日志报错Could NOT find resource [logback.groovy]及Could NOT find resource [logback-test.xml]问题
事件背景: 我的log4j和self4j按照网上的配置,配置成功了,但是报错如下: 让我很是郁闷,于是找了一大圈........ 解决方案: 总结来说就是:log4j.properties和logba ...
- Redis重大版本
Redis借鉴了Linux操作系统对于版本号的命名规则: 版本号第二位如果是奇数,则为非稳定版本(例如2.7.2.9.3.1),如果是偶数,则为稳定版本(例如2.6.2.8.3.0.3.2), 当前奇 ...
- CSS rem长度单位
1. 概述 1.1 说明 rem是css3中新增的一个单位属性(font size of the root element),根据页面的根节点(html)的字体大小进行转换的单位,通过此单位属性可以进 ...
- mysql-约束介绍
一.约束介绍 约束是一种限制,它通过对表的行或列的数据做出限制,来确保数据的完整性.一致性.约束条件与数据类型宽度一样都是可选参数. 常用约束: PRIMARY KEY (PK) 标识该字段为该表的主 ...
- jQuery对url的操作
// 修改URL中指定参数的值 function changeURLArg(url,arg,arg_val){ var pattern=arg+'=([^&]*)'; var replaceT ...
- 对mysql数据库中字段为空的处理
数据库中字段为空的有两种:一种为null,另一种为空字符串.null代表数值未知,空字符串是有值得,只是为空.有时间我们想把数据库中的数据以excel形式导出时 如果碰到字段为空的,为空的字段会被后面 ...
- iOS -- Effective Objective-C 阅读笔记 (2)
1: 多用类型常量, 少用 #define 预处理指令 #define 预处理指令会把碰到的所有 指定名称 一律换位 定义的内容, 这样的话, 假设此指令在某个头文件中, 那么所有引入这个头文件的代码 ...