移动开发,Webapp 淘宝手机 rem 布局
(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 布局的更多相关文章
- 淘宝手机rem的如何使用
1.主要介绍几个移动端常用的单位rem.vw.vh,配合传统的px.百分比.<viewport>标签,兼容适配移动端的各种分辨率的手机端. rm : 这个单位是以父元素为标准来进行计算 , ...
- 妈妈再也不用担心我的移动端了:网易和淘宝的rem方案剖析
从博主学习前端一路过来的经历了解到,前端移动开发是大部分从PC端转战移动端的小伙伴都非常头疼的一个问题,这边博主就根据一篇自己看过的移动开发文章来剖析一下网易和淘宝的rem解决方案,希望能够帮助到一些 ...
- 原生js仿淘宝手机购买选项代码
这是一款基于原生js实现仿淘宝手机信息购买选项效果源码,界面整体效果仿照淘宝购物选项设计,点击不同选项还可实时显示不同的价格计算结果,界面简洁大方.美观实用.可兼容目前最新的各类主流浏览器. 在线演示 ...
- 网易和淘宝的rem方案剖析
以下内容到分割线前是引用前端大牛的文章,方便大家理解博主内容): 从网易与淘宝的font-size思考前端设计稿与工作流 1. 简单问题简单解决 我觉得有些web app并一定很复杂,比如拉勾网,你看 ...
- 仿淘宝使用flex布局实现页面顶部和底部的固定布局
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- Android开发案例 - 淘宝商品详情
所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等其他信息放在下页展示 知识要点 垂直方向的ViewPa ...
- Android开发案例 - 淘宝商品详情【转】
http://erehmi.cnblogs.com/ 所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等 ...
- 使用vue开发webApp,安卓手机自带回退键的问题解决
首先,我先为大家说明,为什么我要写这篇随笔: 因为我们写的webapp,在安卓手机上,按一次回退键,就会退出app,回到桌面,而不是像原生app一样,会有一个提示,例如,“再按一次退出应用”的这种提示 ...
- iOS开发 仿淘宝,京东商品详情3D动画
- (void)show { [[UIApplication sharedApplication].windows[0] addSubview:self.projectView]; CGRect fr ...
随机推荐
- ruby on rails 环境搭建步骤
1.安装ruby ruby的下载页面一个版本有3样要下载的,帮助文件和安装文件.还有一个mingw. 安装时抛出make出错信息就是由于没有安装mingw引起的 到下载页http://rubyforg ...
- stm32之UCOS-III
一.UCOS-III 学习UCOS-III,一般会学习以下内容: 任务创建.删除.挂起.恢复等: 临界区:独占CPU,尽量少用,否则会降低效率: 时间管理:时钟节拍(基于硬件定时器).软件定时器: 互 ...
- [51nod1247]可能的路径(思维题)
题意:给定(a,b),(x,y) ,(a,b)可以通向(a-b,b) (a+b,b) (a,a+b) (a,a-b) 求能否到达(x,y) 解题关键:类似于更相减损,变换过程中gcd是一样的. #i ...
- C++类中的常数据成员和静态数据成员的区别
刚开始学习C++的类和对象的部分,对类中的常数据成员和静态数据成员的概念和用法经常混淆,所以今天整理一下,顺便说一下,今天是我的生日,祝我生日快乐,呵呵. 常数据成员 常数据成员是指在类中定义的不能修 ...
- ubuntu14.04装完系统更新后桌面挂了
一开始是只显示个鼠标什么都没有,ctrl-alt-1切到控制台下,把lightdm重启下再进去,多了两个桌面图标,但是顶栏和侧栏都没有,也就是根本没法运行其它程序. 但是幸好桌面右键菜单里有一个“在控 ...
- CodeForces 279C Ladder (RMQ + dp)
题意:给定一个序列,每次一个询问,问某个区间是不是先增再降的. 析:首先先取处理以 i 个数向左能延伸到哪个数,向右能到哪个数,然后每次用RQM来查找最大值,分别向两边延伸,是否是覆盖区间. 代码如下 ...
- java多线程系列:ThreadPoolExecutor源码分析
前言 这篇主要讲述ThreadPoolExecutor的源码分析,贯穿类的创建.任务的添加到线程池的关闭整个流程,让你知其然所以然.希望你可以通过本篇博文知道ThreadPoolExecutor是怎么 ...
- jQuery 选择表格(table)里的行和列及改变简单样式
本文只是介绍如何用jQuery语句对表格中行和列进行选择以及一些简单样式改变,希望它可以对jQuery表格处理的深层学习提供一些帮助jQuery对表格(table)的处理提供了相当强大的功能,比如说对 ...
- FormsAuthentication.RedirectFromLoginPage 登录
首先讲的这个东西是针对后台数据访问的比如我的后台是admin文件夹.那么我除非登陆成功才可以访问里面的东西.那么除了Session对象判断.和Cookies来判断还能用到FormsAuthentica ...
- 使用MailMessage发送邮件
SmtpClient smtp = new SmtpClient(); //实例化一个SmtpClient smtp.DeliveryMethod = SmtpDeliveryMethod.Netwo ...