多点触控插件Hammer.js

所属分类:UI-背景

 206264  443  查看评论 (10)
分享到微信朋友圈
X
多点触控插件Hammer.js ie兼容10

=================以下内容由 Mr.li√ 提供===============

使用方法:

<script src="http://eightmedia.github.com/hammer.js/hammer.js"></script>

// 先要对监听的DOM进行一些初始化
var hammer = new Hammer(document.getElementById("container"));

// 然后加入相应的回调函数即可
hammer.ondragstart = function(ev) { };  // 开始拖动
hammer.ondrag = function(ev) { }; // 拖动中
hammer.ondragend = function(ev) { }; // 拖动结束
hammer.onswipe = function(ev) { }; // 滑动

hammer.ontap = function(ev) { }; // 单击
hammer.ondoubletap = function(ev) { }; //双击
hammer.onhold = function(ev) { }; // 长按

hammer.ontransformstart = function(ev) { }; // 双指收张开始
hammer.ontransform = function(ev) { }; // 双指收张中
hammer.ontransformend = function(ev) { }; // 双指收张结束

hammer.onrelease = function(ev) { }; // 手指离开屏幕

还支持jQuery插件的形式调用

<script src="http://eightmedia.github.com/hammer.js/jquery.hammer.js"></script>

$("#element")
   .hammer({
        // 对DOM进行一些初始化,这里可以加入一些参数
   })
   .bind("tap", function(ev) {
        console.log(ev);
   });
相关插件-背景

jQuery全屏背景插件Vegas2

网页全屏背景jQuery插件 Vegas2,它和其它背景插件不同之处就是带有幻灯片功能。幻灯片的切换有多种风格,如旋转、渐隐、左右等方式,切换的时候还有进度条显示。
  背景
 41269  493

基于canvas的星空效果

基于canvas的星空粒子效果(代码注释全!)
  背景
 71325  404

漂亮的全屏Slideshow幻灯滑块效果(jQuery)

漂亮的全屏Slideshow幻灯滑块效果(jQuery)
  背景
 41369  417

全屏背景图片

全屏背景图片简单好用
  背景
 57619  364

讨论这个项目(10)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    panking 0
    2022/12/13 11:01:43
    插件不行啊,下往上移数据不准,div都飞出天际了 回复
    asaguise 0
    2019/10/10 13:59:14
    放大后有自动还原回去了,而且两指放大会自动旋转? 回复
    kuma 0
    2017/10/25 17:07:18

    拖动和放大后不自动还原,怎么做

    回复
    -果冻-- 0
    2016/10/12 10:10:56
    也不把代码整理一下,跟在官网下的一模一样 回复
    q-xun 0
    2016/4/19 13:04:03
    两指转动图片旋转能实现吗 回复
    春风十里不如你 0
    2016/3/25 15:03:21
    能用,但是扩展性太差了,基本无代码注释太晦涩难懂了 回复
    ζ?????Dobi 0
    2016/3/24 18:03:50
    undefind is not a function
        春风十里不如你0
        2016/3/25 15:03:56
        js路径看看有没有设置错
    回复
    思进取. 0
    2015/7/16 9:07:22
    jackple 0
    2015/7/11 21:42:40
    如果我想做一个点击按钮背景颜色的效果改怎么设置啊? 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复