Javascript触屏手势库-jTouch
触屏手势库--JTouch
封装的代码有不足支出，以及bug等欢迎大家多多指正。
Github地址： （大家可以fork项目跟踪最新进展）
JTouch的介绍
JTouch是针对触屏浏览器提供的一个手势集合，由于我的测试环境主要是ipad，所以对于其他触屏设备的支持情况可能会有所不足。这个在后期版本升级过程中会修复。
JTouch在手指移动上去会触发start事件，结束会触发end事件。 主要支持的手势有tap(单击)，doubletap(双击)，longtap（长按），hold（拖拽），swipe（滑动），flick（轻 拂），pinch（捏合，拉伸），rotate（旋转）；除了pinch，rotate手势外，其他手势事件的回调函数都会返回data['fingerNum']值，所以在回调函数中可以根据手指的数量来拼合其他的事件。
其中每个手势事件都会返回响应的回调函数，接受回调函数的参数值一般定义为evt和data，可自行设定。
- 其中swipe和flip可以返回方向data['direction']以及左右，上下移动的距离data['x']，data['y']，swipe事件结束会返回状态值data['status'] == end；
- pinch会返回type信息，即in和out，来判断向里还是向外压缩或者拉伸;返回data['scale']表示缩放比例；
- rotate同样会有direction信息来简单判断向左旋转亦或向右旋转，同时返回data['rotation']作为角度信息；
- 每个手势事件都有相应的event对象返回，其中pinch和rotate返回的与其他的event对象是不同的，这两个返回的是gesturechange的事件对象，（详细信息可以在debug模式下调试查看）
jTouch的使用
- 实例化var objTouch = document.getElementById('touch');var Touches = JTouch(objTouch);
- 采用链式写法，
Touches.on('手势名称',function(evt,data){
//回调函数部分}) - 回调函数中返回相应的值
JTouch的示例
触摸平滑移动，其中用到了单独封装的translate插件，时间有限代码略显粗糙，各位看官见谅。
稍微仿了下ipad的界面效果，有太多不足支持。长按可以触发icon抖动，双击空白取消效果，但是取消效果过程会产生抖动，希望哪位高人提点意 见。其中想到了用-webkit-animation-play-state:paused;来实现，但是具体如何让动画停在第一帧不甚了解。
另外做了个简单的图像效果，这个效果的flick效果还没有强化，关于这个效果我感觉我实现的复杂了一些，但是暂时没有想到万全之策，所以里面出现了不少的参数，哪位高人见到可以优化之。大家可以根据这个效果扩展成一个相册效果。具有左右翻的效果。
更新记录：
v1.1更新记录：
命名jTouch -> JTouch实例化不需要new，直接JTouch加入鼠标手势操作，鼠标可以实现tap.doubletap,swipe,hold,flip操作，可以用mousewheel模拟pinch加入init(),destory()功能来实现重置和销毁不足：手头没有win8的平板，暂时没有实现ie10的触控手势