【原】pageResponse - 让H5适配移动设备全家(移动端适配)


上一篇文章《为什么选择iPhone5的分辨率作为H5视觉稿尺寸》最后留下了问题:是否需要视觉设计师设计多套的视觉稿供给前端工程师做页面适配呢?按照自己以前的方法,通常会要求设计师设计2套的尺寸,一套是窄屏手机(如iPhone4),另一套是宽屏手机(如iPhone5),这样的好处不仅减少重构页面的适配成本外,也在页面展现上提升页面的用户体验。

然而不管是设计2套还是3套以上的视觉稿来辅助前端来完成页面,最终还是会抵挡不住设备更新换代带来的适配问题,移动设备不断从低分辨率到高分辨率过渡,不同分辨率尺寸差异越来越大,适配越来越头疼。

亲,你还在为以上事情烦恼吗?来~请使用新鲜出炉的pageResponse.js,一套视觉稿适配移动设备全家,让烦恼通通见鬼去!!!

目录(更新于20151013)

  • 原理及说明
  • github地址
  • 真实案例
  • contain模式(推荐)
  • cover模式
  • auto模式(默认模式)
  • 结合fullPage滑屏框架的例子
  • 快速上手

https://github.com/peunzhang/pageResponse 

预览

预览

预览

预览

demo下载

欢迎大家使用,插件还有很多的不足,对于复杂的页面并不合适,具体结合实际项目,任何问题欢迎留言探讨~

祝大家粽子节快乐~