一套视觉稿适配所有移动设备的js框架：pageresponse

目前很多APP设计师已经开始在为h5做一些设计工作或者很多小伙伴也开始尝试学习H5的知识啦。

那么要想一套视觉稿适配所有移动设备，肯定得想个办法啊。除了用rem单位以外，还可以采用js来实现。

比如今天25学堂要分享的就是前端大神白树的一个一套视觉稿适配所有移动设备的js框架：pageresponse。

移动端的适配效果如下：

PC端的适配效果如下：

链接地址：http://ol.weixin.qq.com/public/users/peunzhang/cashier/index.html

pageresponse.js算是移动端一款响应式插件吧。

使用transform:scale缩放页面，要求视觉稿高清

页面以px为单位即可让h5适配各种移动设备，适配原则根据视觉稿比例缩放页面

告别rem、媒体查询、百分比等相对复杂且定位不精准的布局

兼容性良好，支持ios4+、android2.3+、winphone8+系统

约1k，零依赖

三种适配模式可选 auto || contain || cover

真实案例：超级收银员

手机扫码预览：

github仓库地址：https://github.com/peunzhang/pageResponse

更多关于一套视觉稿适配所有移动设备的js框架：pageresponse.js的详细介绍和使用手册可以阅读白树的博客。

作者白树简介：目前就职于腾讯微信支付设计中心，负责移动端产品，擅长html5、css3、javascript，热爱前端构建、模块化开发。

原文地址：http://www.cnblogs.com/PeunZhang/p/4517864.html

另外，国外也有一款类似的jquery移动适配插件：Response JS 

Response JS 是一个轻量级的 jQuery 插件，用来创建高性能的支持移动设备的网站。它提供了一套语法用来根据不同的环境动态替换HTML代码。例如根据屏幕大小，动态的替换img标签的src地址。

官网：http://responsejs.com/