(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. shutdown-用于关闭/重启计算机

    Linux系统下的shutdown命令用于安全的关闭/重启计算机,它不仅可以方便的实现定时关机,还可以由用户决定关机时的相关参数.在执行shutdown命令时,系统会给每个终端(用户)发送一条屏显,提 ...

  2. shell判断网络主机存活

    判断网络主机存活企业面试题4:写一个脚本,实现判断10.0.0.0/24网络里,当前在线用户的IP有哪些(方法有很多) #!/bin/sh#[ -f /etc/init.d/functions ] & ...

  3. JSP相关背景

    -----------------siwuxie095                             Sun Microsystems             SUN 即 Stanford ...

  4. sklearn常用数据的使用

    from sklearn import datasets from sklearn.linear_model import LinearRegression #加载数据 loaded_data = d ...

  5. 6.5 Ubuntu中安装搜狗输入法

    传统的方式:http://www.cnblogs.com/zlslch/p/6943318.html 最简单的方式:

  6. HTML中的ID不能以数字开头

    最近在学习网页制作,发现ID在w3c规范里是不能以一个数字开头的,chrome浏览器是可以,firefox就不能使用数字开头了,其它浏览器未测试. 记录一下! W3C规范链接:http://www.w ...

  7. git中避免提交.DS_Store文件[转载]

    1. 先删除原有的.DS_Store: find . -name .DS_Store -print0 | xargs -0 git rm -f --ignore-unmatch 命令解释:在当前文件夹 ...

  8. 关于PHP在企业级开发领域的访谈——企业级开发,PHP准备好了吗?

    关于PHP在企业级开发领域的访谈 ——企业级开发,PHP准备好了吗? 转自:http://www.nowamagic.net/librarys/veda/detail/256 虽然PHP是Web应用开 ...

  9. MySQL数据库修改字符集为UTF-8

    需要修改my.ini [client]下添加 default_character_set = utf8 [mysql]下添加 default_character_set = utf8 [mysqld] ...

  10. Docker 企业级镜像仓库 Harbor 的搭建与维护

    目录 一.什么是 Harbor 二.Harbor 安装 2.1.Harbor 安装环境 2.2.Harbor安装 2.3 配置HTTPS 三.Harbor 的使用 3.1.登录Harbor并使用 3. ...