Casual & Fellow

周日下午小尝试-触摸反馈

炎热的周日下午,修复了一些bug(部分bug和项目有关,暂时不说),也做了一些代码片段,以便日后使用。这个文章也主要是用于给大家说说这个代码片段的由来以及要解决的问题。以顺便复习一下此前说的一些小问题。

这个代码片段的地址我已经放到了Github上面,当然这个是我随便写的,还有要提升的地方。这算是一个稍微提升用户体验的效果吧。上上个星期,我参加了爱范儿的一个活动 http://www.ifanr.com/124109 那个活动主要是分享创业经验以及产品的。当时恰好听了新点科技的吴晓丹说的一句话:提高App的响应速度。一个细节的地方在于给应用增加一个点击的反馈。

就是这句话触动了我,此前在做WebApp的时候一直遇到的问题就是响应度问题,首先WebApp存在http请求的话,而且要载数据是固然慢的,即使是制作Phonegap的应用,因为内嵌载UIWebview里面,性能也没有原生的Safari浏览器高,提高响应度是迫在眉睫的事情,因为用户都是急躁的。此前也有做过一个小小的代码总结,就是鼓励大家一定一定要用Touch事件来代替点击事件,尤其是在移动端的WebApp上,因为点击是有延迟的。我做的Touch事件的封装在此:https://gist.github.com/1750374 ,对此我们并没有在视觉上让用户感知。其实提高App响应度,在App的界面上提供点击反馈,这个早就有了,而这些细节往往是我们做WebApp的时候忽略掉的。因此我就做了一个小东西,也尝试了一下,方便自己日后使用吧。就是增加一个点击反馈的效果到页面中。其实就是用了一个a标签解决了。在做的过程中呢,也会出现一些小问题,希望大家日后在做开发的时候注意到:

1,onclick事件在移动端WebApp中是有延误的,不要用了。

2,onclick事件获取鼠标位置(也就是以前的浏览器中event.pageX或者pageY的对象在mobile safari中是undefined的),但是touch事件是有效的,具体怎么做,你可以看我代码。

3,此外,我尝试去使用zepto.js的时候,也发现其提供的tab事件,也是不能获取当前touch位置的,我不清楚其他的框架是否也如此。看来这些框架还有待进一步封装啊!

好了,这个就是我写的代码片段的地址:https://gist.github.com/3264126

这个就是截图: