基础触屏手势学习

8次阅读

共计 429 个字符,预计需要花费 2 分钟才能阅读完成。

最近接到一个小的项目,需要实现触屏滑动,图片缩放旋转移动,故而花了三天时间学习并实现了一下,在此记录一下学习过程:
关键就是 css、触屏手势
用到的技术:
css 过渡 css2D 转换 hammer.js AlloyFinger.js

css 我就不说了,hammer.js 与 AlloyFinger.js 是属于轻量级的触屏手势封装库,其中水平移动用的是 hammer.js, 别的功能用的是 AlloyFinger.js。
关键参数:
移动:X 轴、Y 轴
缩放:缩放的倍数
旋转:角度
这些参数都可以打印出来。
需要注意的是使用 hammer.js 实现移动后,我暂时没有办法使他从第一次滑动结束的位置接着继续滑动
我写的一个 demo,https://github.com/liuguodong…

用到的技术官网链接:http://www.w3school.com.cn/cs…
https://hammerjs.github.io/
http://alloyteam.github.io/Al…

正文完
 0