博客迁移至http://www.maxzhang.com,欢迎访问!

摘要: 博客迁移至http://www.maxzhang.com,欢迎访问! 阅读全文
posted @ 2013-08-01 22:04 max12 阅读(288) 评论(0) 推荐(0) 编辑

iBox v2.0 发布,Web化仿iOS7界面/交互的JavaScirpt库

摘要: iBox2 是一个仿 iOS 7 界面/交互的 JavaScirpt 库,它运行在 webkit 内核的移动浏览器之上,依赖 iScroll5,帮助开发者构建更接近 iOS 体验的 WebApp。伴随iOS7的发布,新的扁平化设计带来很多体验上的改变。从iOS7发布beta1的时候就产生了开发iBox2的想法,到iBox2开发完成时,已经快要发布beta4了(写文章的时候,正好更新beta4)。iBox v2.0 的特征:适配iOS7效果;更加注重扩展性,可以自定义Header组件;接口设计更加简洁,尽量将外部调用最简单;项目地址:https://github.com/maxzhang/ibo 阅读全文
posted @ 2013-07-30 16:49 max12 阅读(492) 评论(0) 推荐(0) 编辑

移动端web页面使用position:fixed问题总结

摘要: 近期完成了一个新的项目(搜狐直播),其中又涉及到了 fixed(固定位置定位)的问题,在之前的文章《移动Web产品前端开发口诀——“快”》中已经阐述过我对 iScroll 的态度,所以在这个项目中我决定不使用 iScroll,使用 position:fixed 实现头部、底部模块定位。在使用fixed的过程中,遇到了一些的问题,并且部分问题无法找到较好的解决方案。下面我就将这些问题一一阐述,提供给大家参考。正常界面图中被红色选中区域为 position:fixed 元素问题1:footer输入框 focus 状态,footer 被居中,而不是吸附在软键盘上部。(该问题已在iOS7 beta3修 阅读全文
posted @ 2013-07-05 16:45 max12 阅读(15050) 评论(10) 推荐(2) 编辑

移动Web产品前端开发口诀——“快”

摘要: 前言“天下武功无坚不摧,唯快不破”,这句话最早是出自古龙小说《小李飞刀》,其实不论是武功还是产品,口诀都是一个字——快。一个好的产品,无论是页面加载速度,还是响应用户点击动作,都应当非常快,能快速的把响应内容反馈给用户,对于用户而言,快就是使用流畅——不卡。移动端浏览器现状现在的移动端浏览器十分混乱,在iOS下由于Apple的限制,所有浏览器都是webkit内核,并且iPhone机器性能以及iOS系统优化得十分优秀,BUG的一致性表现得非常统一,无论是哪个浏览器都会相对容易做兼容。但在Android设备下,由于操作系统、硬件配置和浏览器差异等问题,导致Web产品在Android下表现参差不齐。 阅读全文
posted @ 2013-05-04 01:03 max12 阅读(2085) 评论(2) 推荐(2) 编辑

Windows Phone 8下 IE10 别忘记添加X-UA-Compatible

摘要: 今天是第一次在 Windows Phone 8 IE10 下调试页面程序,发现在iOS、Android下运行正常的程序,功能全部失效了,随后查看了IE设置选项,设置没有问题。在这点上卡了一会,突然想起是否兼容模式的问题?增加X-UA-Compatible之后,刷新页面,一切正常。结论Windows Phone 10 下 IE 默认启动兼容模式加载页面,在WP8下开发的同学们,千万不要忘记给页面加X-UA-Compatible。关于X-UA-Compatible的用法,传送门:http://lightcss.com/add-x-ua-compatible-meta-to-your-website 阅读全文
posted @ 2013-05-03 13:36 max12 阅读(345) 评论(0) 推荐(0) 编辑

如何有效的评估工程师的时间进度

摘要: 今天我在知乎上回答了一个问题《怎么跟工程师沟通时间进度问题?》,回答完之后又思考了很多,觉得有必要总结下如何有效的评估工程师的时间进度?这个问题。1、任务拆解我在这里不论述计划如何制定,只是讨论任务拆解对一个工程师评估工期的重要性。通常情况下,大部分工程师不做任务拆解,也不知道怎么进行拆解。当你问一个工程师这个项目开发要多久时间时,他会告诉你要10天,但是,你并不明白为啥要10天,可能他自己都不清楚为啥要10天,只是凭着以往的经验评估出来的。还有10天不等于10个工作日,这是一个陷阱,一定不要被10天所迷惑到,如果是10个工作日那就代表2周,就是14天了。任务拆解最重要的一步是系统设计,无论你 阅读全文
posted @ 2013-05-03 11:51 max12 阅读(676) 评论(0) 推荐(0) 编辑

代理orientationchange事件回调函数

摘要: 我们在开发Web App时,通常会遇到一些兼容性问题,orientationchange事件就是其中之一。严格来说,并不是orientationchange有兼容问题,而是触发orientationchange事件回调函数时有兼容问题(很绕口啊)。具体表现在回调函数中获取window.innerWidth与window.innerHeight属性上的差异。在safari下,对orientationchange支持很好,当orientationchange触发回调时,使用window.innerWidth能或立刻获取到最新的屏幕高宽。而在Android浏览器下,需要延迟一定的时间,才能获取到正确 阅读全文
posted @ 2013-05-02 18:39 max12 阅读(784) 评论(0) 推荐(0) 编辑

按垂直领域细分的网址导航模式

摘要: 网址导航属于传统的浏览模式,类似于在图书馆找书、在菜市场找菜、在超市找物品等。网民浏览网站传统模式:网址→寻找内容,这种模式对于新网民或比较懒的人或想进入另一领域的老网民不适用,这一类网民通常会使用网址导航作为入口,这样产生了第二种模式:导航→网址→寻找内容。在第二种模式中,用户会产生两个层次的需求:第一需求,What do I want to do? 我想做什么?这是用户产生的最原始需求,也是用户来访问导航的第一动力。大多数懒用户并不习惯于记忆网址或压根就不知道网址,很多网民依然保持以百度为入口,凡事先百度一下的这种使用习惯。导航是搜索的良好补充,互联网搜索是解决用户搜索信息的个性化,而网址 阅读全文
posted @ 2013-05-02 18:34 max12 阅读(556) 评论(0) 推荐(0) 编辑

Backbone vs Ext JS 4 MVC

摘要: 导读最近一段时间,我在研究移动WebApp应用开发,想在设计WebApp前端JS构架时,使用MVC分层技术,经过一段时间的技术选型,最终确定使用Backbone JS作为底层基础MVC框架。在使用Backbone写示例时,总是觉得非常怪,但又说不出怪在哪,所以,就想通过Backbone与Ext JS 4 MVC的对比,来发现Backbone的缺点与优化点。PS:由于我在做Desktop前端JS开发时,十分青睐Ext JS这一类的框架,Ext JS 4 MVC是我认为在所有框架中做得最好的。特性对比在对比两个MVC框架之前,必须理解四个十分重要的特性:UI Bindings:[UI 绑定] 我想 阅读全文
posted @ 2013-05-02 18:32 max12 阅读(551) 评论(0) 推荐(0) 编辑

Canvas学习,利用业余时间写了个小游戏,俄罗斯方块

摘要: 利用业余时间写了个小游戏,俄罗斯方块,在chrome浏览器下运行流畅,没有过多的美化,也没有做性能调优。试玩地址:http://caytetris.sinaapp.com/使用了HTML5 CSS3的特性,canvas是自己第一次使用,绘图速度很快。在这里,只有积木是使用的canvas绘制的,背景和界面UI都是用的普通html。对性能影响最大部分是算法。图形绘制在chrome20和firefox9下,没有察觉到明显的性能差别,在绘制像素不复杂的图形时,保持50fps,没有察觉到任何性能变化。不知道在大型游戏开发中,绘制像素要求高的图形性能怎么样。由于在设计之初没有考虑性能,所以,就是想到哪写到 阅读全文
posted @ 2013-05-02 18:29 max12 阅读(277) 评论(0) 推荐(0) 编辑