注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

百鬼夜行

身是菩提树,心如明镜台,时时勤拂拭,勿使惹尘埃。

 
 
 

日志

 
 

移动web开发,12个触摸及多点触摸事件常用Js插件  

2014-07-04 14:29:19|  分类: HTML5CSS3WEBAPP |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
http://www.vipaq.com/Article/View/blog/390.html

如今移动互联网已经占据了主流地位,越来越多的开发者开始从桌面转向移动平台。与桌面开发不同的是,在移动领域中,不同的操作系统、大量不同屏幕尺寸的移动设备、触摸手势操作等,这都给开发者带来了一定的难度和挑战。

web开发手势插件

虽然一些触摸事件,自己写起来也比较简单,但为了尽量不重复的造轮子,提高开发效率。这里收集整理了一些常用的手势事件脚本插件来供你参考。

  1. QUO JS

    支持事件:Touch, Tap, Double tap, Hold, Fingers, Swipe, Swipe Up, Swipe Right, Swipe Down, Swipe Left, Drag
    其它特性:类似jQuery的调用方法. 使用 $$ 方法名避免和jQuery冲突.
    文件大小:压缩后 13KB
    独立使用:
  2. Hammer JS

    支持事件:Tap, Double tap, hold, drag, transform (pinch)
    其它特性:主要用于多点触摸的Js库。
    文件大小:压缩后 2KB
    独立使用:
  3. jQuery Mobile

    支持事件:scrollstart, scrollstop, swipe, swipeleft, swiperight, tap, taphold, vclick, vmousecancel, vmousedown, vmousemove, vmouseout, vmouseover
    其它特性:特别针对触摸设备使用的一套框架,但笔者在使用swipeleft和swiperight事件时,感觉不是特别准确。并且在设置了相应的配置项,并没有起作用。如果你知道正确的方法,请不吝惜的在留言里告诉我吧。多谢!!!
    文件大小:压缩后 142KB
    独立使用:否, 依赖 jQuery
  4. Touchy

    支持事件:long press, drag, pinch, rotate, swipe
    其它特性:以jQuery插件的形式使用,支持webkit内核的浏览器以及其它支持触摸事件的浏览器。
    文件大小:~2.72KB
    独立使用:否, 依赖 jQuery
  5. Mootools-mobile

    支持事件:Swipe, pinch, touch hold
    其它特性:触摸事件依赖引入单独的脚本文件。
    文件大小:-
    独立使用:否, 依赖 MooTools
  6. jQuery doubletap

    支持事件:Touch, Swipe, Tap, Double tap, Swipe left, Swipe Right, Swipe up, Swipe down
    其它特性:尚不支持android设备。
    文件大小:4KB
    独立使用:否, 依赖 jQuery
  7. jGestures

    支持事件:Orientation change, Pinch, Rotate, Swipe move, Swipe in multi direction, Swipe with 1,2,3 fingers, Tap with 1,2,3 fingers, pinch open, pinch close, shake in different directions
    其它特性:支持多种手势,以及常用的事件。
    文件大小:压缩后 16KB
    独立使用:否, 依赖 jQuery
  8. Touch Swipe

    支持事件:四个方向的滑动, 1或2只手指的触摸 
    其它特性:支持四个方向的滑动及页面滚动。
    文件大小:25KB
    独立使用:否, 依赖 jQuery
  9. Touchable

    支持事件:Tap, Long Tap, Double tap, touchable move, touchable end
    其它特性:统一了触摸和鼠标事件。
    文件大小:1.96KB
    独立使用:否, 依赖 jQuery
  10. thumbs.js

    支持事件:touch start, touch end, touch end, touch move, mouse down, mouse up, mouse move
    其它特性:主要是给浏览器添加touch事件,对PhoneGap及其它移动web支持良好。
    文件大小:不到1K,压缩后 700 bytes(版本0.6.0)
    独立使用:
  11. jQuery.pep.js

    支持事件:Drag
    其它特性:使用CSS3动画,内置很多的拖动特性。
    文件大小:16KB
    独立使用:否, 依赖 jQuery
  12. Jetster

    支持事件:Tap, Double tap, Swipe, Flick, Pinch, Pinch arrow, Pinch widen, Pinch end
    其它特性:Jester 使得作用在DOM元素上的手势变得相当简单。
    文件大小:25KB
    独立使用:
  评论这张
 
阅读(125)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017