rem布局js脚本代码
目前代码在750屏幕分辨率下是十倍 基本上使用iphone是375宽度 所以就是20倍 图片背景可以使用二倍图
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
if (clientWidth >= ) {
docEl.style.fontSize = '100px';
} else {
docEl.style.fontSize = * (clientWidth / ) + 'px';
//直接输入设计图大小即可
}
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
recalc()
doc.addEventListener('DOMContentLoaded', recalc, false);
/*DOMContentLoaded文档加载完成不包含图片资源 onload包含图片资源*/
})(document, window);
可以搭配vs插件cssrem,在用户设置处设置你需要转换的比率,可以认为是页面中html根元素的font-size

rem布局js脚本代码的更多相关文章
- 关于Cocos Creator用js脚本代码播放骨骼动画的步骤和注意事项
步骤: 1.用cc.find()方法找到相应的骨骼动画节点,并把这个对象赋值给一个var出来的新对象. 具体代码:var spineboy_anim = cc.find("UI_Root/a ...
- 移动端rem布局 js
// rem布局适配 (function(doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in ...
- ASP.NET后台输出js脚本代码
利用asp.net输出js我们大多数都会直接使用Respone.Write()然后根js格式的代码,再在页面调用时我们直接这样是完全可以实现的,下面我来给大家介绍另一种方法 我是我最初的想法以下是代码 ...
- .net 用户控件ascx.cs注册js脚本代码无效果
在.net web项目中碰到一个比较奇怪的问题,网上没找到解决方案,先自己mark一下 问题描述: 添加一个用户控件ascx,在后端.cs添加js注册脚本,执行后没有弹出框 注册脚本为: this.P ...
- php使用正则过滤js脚本代码实例
匹配的规则不能用 "/<script.*<\/script>/i",因为它不能匹配到换行符,那么多行js就匹配不掉了. 要用 "/<script[ ...
- 移动手机专题rem布局实践+主要代码
HTML开头部分 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" / ...
- js脚本代码调试小技巧
以前写js代码调试代码查看数据是否正确的时候不知道F12(开发者工具),都是alert(xxx)或者console.log(xxx), 现在知道还可以用document.write或者try...ca ...
- 总结ASP.NET C#中经常用到的13个JS脚本代码
1.按钮前后台事件 <asp:Button ID="Button1" runat="server" OnClick="Button1_Click ...
- rem布局js实现
(function(designWidth, maxWidth) { var doc = document, win = window; var docEl = doc.documentElement ...
随机推荐
- linux可执行程序调试
gdb调试不用多说 ./testapp 2>%261 适合线上问题排查,可打印程序错误接口代码 ldd testapp 查看代码动态链接程序是否正常
- STC8
一 时钟: IRC:24MHZ;LSI:32.768KHZ;HSE:4~33MHZ,外设可分频 二 2种低功耗模式: IDLE:1.3MA@6MHZ,外设可唤醒. STOP: 三:ISP下载更新模式: ...
- 根据class 属性判断所有的文本框必填
<body> <!-- 遮罩层 --> <div id="hidediv" style="width: 100%;height: 100%; ...
- jqGird错误“decimalSeparator”的解决办法
在使用jqGrid的过程中,突然出现以下错误: jquery.jqGrid.js:15016 Uncaught TypeError: Cannot read property 'decimalSepa ...
- New Airless Pump Bottle Technical Features
Airless Pump Bottle protect sensitive products such as natural skin creams, serums, foundations a ...
- 11 JavaScript Number原始值&对象&科学记数法&范围&进制转换&溢出Infinity&NaN
JavaScript Number对象 是经过封装的能处理数字值的对象 由Number()构造器创建 只有一种数字类型 可以使用也可以不使用小数点书写数字 JavaScript原始值与对象: 在Jav ...
- Web - 实用组件
1, vue-awesome-swiper 基于 Swiper4.适用于 Vue 的轮播组件,支持服务端渲染和单页应用. 2, http://www.spritecow.com/ 雪碧图背 ...
- SQL数据库入门基础
SQL(Structure Query Language,结构化查询语言)语言是国际标准化组织(ISO)采纳的标准数据库语言. 数据库就是一幢大楼,我们要先盖楼,然后再招住户(住户当然就是数据库对 ...
- 设计模式课程 设计模式精讲 8-8 单例设计模式-Enum枚举单例、原理源码解析以及反编译实战
1 课堂解析 2 代码演练 2.1 枚举类单例解决序列化破坏demo 2.2 枚举类单例解决序列化破坏原理 2.3 枚举类单例解决反射攻击demo 2.4 枚举类单例解决反射攻击原理 3 jad的使用 ...
- spark bulkload hbase笔记
1. 现有的三方包不能完全支持 - 官方:hbase-spark,不能设置 timestamp - unicredit/hbase-rdd:接口太复杂,不能同时支持多个 family 2. HFile ...