(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 = 12 * (clientWidth / 320) +"px";
console.log(12 * (clientWidth / 320) +"px");
}else{
//docEl.style.fontSize ="12px";
docEl.style.fontSize = 12 * ( 640 / 320) +"px";
}
}; if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);})(document, window);

移动开发,Webapp 淘宝手机 rem 布局的更多相关文章

  1. 淘宝手机rem的如何使用

    1.主要介绍几个移动端常用的单位rem.vw.vh,配合传统的px.百分比.<viewport>标签,兼容适配移动端的各种分辨率的手机端. rm : 这个单位是以父元素为标准来进行计算 , ...

  2. 妈妈再也不用担心我的移动端了:网易和淘宝的rem方案剖析

    从博主学习前端一路过来的经历了解到,前端移动开发是大部分从PC端转战移动端的小伙伴都非常头疼的一个问题,这边博主就根据一篇自己看过的移动开发文章来剖析一下网易和淘宝的rem解决方案,希望能够帮助到一些 ...

  3. 原生js仿淘宝手机购买选项代码

    这是一款基于原生js实现仿淘宝手机信息购买选项效果源码,界面整体效果仿照淘宝购物选项设计,点击不同选项还可实时显示不同的价格计算结果,界面简洁大方.美观实用.可兼容目前最新的各类主流浏览器. 在线演示 ...

  4. 网易和淘宝的rem方案剖析

    以下内容到分割线前是引用前端大牛的文章,方便大家理解博主内容): 从网易与淘宝的font-size思考前端设计稿与工作流 1. 简单问题简单解决 我觉得有些web app并一定很复杂,比如拉勾网,你看 ...

  5. 仿淘宝使用flex布局实现页面顶部和底部的固定布局

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  6. Android开发案例 - 淘宝商品详情

    所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等其他信息放在下页展示 知识要点 垂直方向的ViewPa ...

  7. Android开发案例 - 淘宝商品详情【转】

    http://erehmi.cnblogs.com/ 所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等 ...

  8. 使用vue开发webApp,安卓手机自带回退键的问题解决

    首先,我先为大家说明,为什么我要写这篇随笔: 因为我们写的webapp,在安卓手机上,按一次回退键,就会退出app,回到桌面,而不是像原生app一样,会有一个提示,例如,“再按一次退出应用”的这种提示 ...

  9. iOS开发 仿淘宝,京东商品详情3D动画

    - (void)show { [[UIApplication sharedApplication].windows[0] addSubview:self.projectView]; CGRect fr ...

随机推荐

  1. Python函数(十二)-迭代器

    字符串,列表,元组,字典,集合,生成器这些能通过for循环来遍历的数据类型都是可迭代对象 可通过isinstance判断是不是可迭代对象 >>> from collections i ...

  2. python version 2.7 required,which was not found in

    python version 2.7 required,which was not found in 出现上面这种情况的原因我推测有两种: 1.NumPy和SciPy官方网站上只提供了32bit的文件 ...

  3. JavaScript设模式---单例模式

    单例模式也称为单体模式,其中: 1,单体模式用于创建命名空间,将系列关联的属性和方法组织成一个逻辑单元,减少全局变量. 逻辑单元中的代码通过单一的变量进行访问. 2,三个特点: ① 该类只有一个实例: ...

  4. python 基础 字典 增删改查

    content = {"name":"wd","pc":{"phone":111111,"age": ...

  5. How to Write a Spelling Corrector用java 写拼写检查器 Java实现 以备查验

    import java.io.*;import java.util.*;import java.util.regex.*; class Spelling { private final HashMap ...

  6. 通过HBase Shell与HBase交互

    出处:http://www.taobaotest.com/blogs/1604 业务开发测试HBase之旅二:通过HBase Shell与HBase交互 yedu 发表于:2011-10-11 浏览: ...

  7. Java基础 -- 泛型之泛型参数

    泛型机制常用的参数有3个: “?”代表任意类型.如果只指定了<?>,而没有extends,则默认是允许任意类. extends关键字声明了类型的上界,表示参数化的类型可能是所指定的类型,或 ...

  8. SAS笔记(4) FIRST.和LAST.临时变量

    FIRST.和LAST.临时变量是SAS很有特色的一点,我在R和Python中暂时没有发现类似的功能(也许它们也有这个功能,我不知道而已).考虑这样一种场景:我们有患者就诊的数据,每一条观测对应一个患 ...

  9. 远程控制Ubuntu系统小结

    一.在远程控制的Ubuntu上,按shift键总会出现中文字符 因为在Ubuntu中,默认启动搜狗输入法,导致在按shift键时,不停出现中文字符 一开始以为是因为远程控制,在主控机和被控机的输入法之 ...

  10. 浅谈JavaScript--this指向

    js中this的值取决于调用的模式 方法调用模式 var student={ name:"adoctors", showThis:function(){ console.log(t ...