随笔分类 - 移动web开发
摘要：// PG精简版(function() { var PG = { iosBridge: null, callbackId: 0, callbacks: [], commandQueue: [], ...
阅读全文
摘要：布局自适应自适应，包括基于媒体查询的px布局，百分比布局，rem布局。其中手机淘宝的rem布局方案，很有实践价值。http://www.html-js.com/article/2402触摸手势业内成熟方案有百度的touch.jshttp://touch.code.baidu.com/以及国外的ham...
阅读全文
摘要：bug1:折线图，设置datasetGesture : true时，Y轴的刻度值居然会变。会变也就算了，居然没地方设置不能变。bug2：折线图，设置tap.point事件，和datasetGesture : true，拖动时，返回的(data,i,j)这个i居然是以折线表的展现的0为基准。注：1.我...
阅读全文
摘要：Github:https://github.com/thebird/Swipe以下bug的修复方式皆来自于网上。现在最新的版本是2.0，bug如下：1.触摸后不会自动播放修复方式，function stop() { //delay = 0; delay = options.a...
阅读全文
摘要：一.路由场景是，webview单页面，url不会变化。两个标识，页面自己的路由标识，当前路由状态。进入到某页面，当前路由状态更新为某页面标识。有一张路由表，监听回退事件。一旦回退，依据路由表和当前路由状态，找到页面，触发该页面的回退事件。路由标识名字建议，grandfather-father-son...
阅读全文
摘要：无线web app业务数据model->视图数据view model->视图view视图数据，包括业务数据和css样式业务数据一直被监听，一旦发生数据变化，马上进行视图数据变化，从而改变视图。同理视图数据也在监听当有一组业务数据内容相似，可叫做集合。查询状态管理，比如进入到哪张页面,查询那个等等。对增删改，不进行状态管理。模块管理，分类。基本以树状形式进行管理。当一个事件触发，改变了业务数据和样式数据时，最好分开来绑定。样式模块化，布局样式，局部块样式。事件模块化，页面加载时，用户交互时，页面卸载时。一个模块只做一件事。依赖关系处理，直接依赖，组依赖，全局依赖开展新项目时，1.分析
阅读全文
摘要：flex流动布局用来定高变宽布局，非常好用。参考链接：http://qianduanblog.com/2549.htmlhttp://qianduanblog.com/2779.htmlhttp://qianduanblog.com/2881.html一、图片自适应居中 图片水平垂直居中 - 前端博客demo图片水平垂直居中 - 前端博客demo 推荐使用谷歌浏览器浏览 二、水平响应式列表 水平响应式列表 - 前端博客demo水平响应式列表 - 前端博客demo 推荐使用谷歌浏览器浏览尝试缩放浏览器来查看效果 ...
阅读全文
摘要：简易瀑布流（基于多栏列表流体布局实现） 封装成jQuery插件如下 封装成jQuery插件，简易瀑布流（基于多栏列表流体布局实现）
阅读全文
摘要：移动轮播图我看到两款，一款是无线天猫的m.tmall.com，实现了无缝轮播。一款是蘑菇街的，没有实现无缝轮播。我自己重写一个，类似蘑菇街 基于jQuery的移动轮播图（支持触屏）
阅读全文
摘要：1.定宽定高http://m.tmall.com/2.定高变宽http://3g.163.com/touch3.自适应http://page.m.tmall.com/wave3_d11gj/d11wave3_main_fs_gj.html4.响应式pad+pc，http://www.taobao.com/phone+pad+pc，http://mediaqueri.es/5.瀑布流定高，http://huaban.com/定宽，http://image.baidu.com/channel/star#all&%E9%87%91%E7%A7%80%E8%B4%A4&null&
阅读全文
摘要：1. 2.122333这三个元素宽度不一致，虽然他们的flex都为1。要想一致，去掉他们的-webkit-box-flex，设置他们的width为33.33%。3.在uc，qq手机浏览器上，对于input type="file"不设置宽度时，会挤出父元素的宽度，导致布局破坏。box布局属性，将被flex属性替代。参考：http://www.cnblogs.com/samwu/p/3655196.html
阅读全文
摘要：1.引用2.对于要懒加载的图片进行如下属性设置。其中src为未加载时的图片，dataimg为实际要加载的图片。3.执行lazyload.init();4.分tab的懒加载。判断tab把下面的图片有没加载过。根据loaded属性判断，还要对非当前tab所属的图片进行class lazy去掉。对已加载的...
阅读全文
摘要：移动端网页自定义滚动条 我的开发经验是，横向滚动可以用overflow-x:scoll;然而竖向滚动，当滚到底时，会带动整张页面。原谅我这里忘了测试，好像iphone不会带动，android会带动。这时候你要自己写滚动。 1 2 3 4 5 6 写成zepto插件，注意这里是使用zepto1.2版本，fx要自己组装的。 uscroll插件
阅读全文
摘要：自适应布局 移动端网页的自适应布局。这样可以使屏幕大小不一的手机展示的页面布局比例一致。我们先不用css3的box-flex属性，而是用百分比设置。 绝对定位的参考标准 我是绝对定位块,可以看到子元素的left是参照父元素的宽W，top是参照父元素的高H。子元素的宽参照W，高参照父元素的H。子元素的margin-left参照W，margin-top也是参照W。这是因为margin：10px 10px 10px 10px;，可以缩写成一个margin:...
阅读全文
