hammer.js手势库使用
hammer.js是一款移动端手势库组件,支持pan(拖动)、swipe(滑动)、tap(轻触)、press(按压,即长按)、doubletap(双击)等很多手势操作,提供比较完善的事件监听机制,但是使用的时候遇到很多事件官方默认没有开启,比如想要同时使用单击、双击、按压事件,必须设置如下:
var hammer = new Hammer.Manager(document.getElementById("swiper-wrapper"));
hammer.add( new Hammer.Tap({ event: 'doubletap', taps: }) );
hammer.add( new Hammer.Tap({ event: 'singletap' }) );
hammer.add( new Hammer.Press({ event: 'press' }) );
hammer.get('doubletap').recognizeWith('singletap');
hammer.get('singletap').requireFailure('doubletap');
hammer.get('press').set({enable: true });
hammer.on('doubletap', function(ev) { //双击
deviceone.print(ev.type);
}).on('singletap', function(ev) { //单击
//do_App.closePage();
deviceone.print(ev.type);
}).on("press",function(ev){ //长按
//do_Page.fire("showTool",{"index":index,"url":images[index].source,"isshow": true});
deviceone.print(ev.type);
});
ev是事件对象,包含很多属性,具体点击官网查看。
hammer.js手势库使用的更多相关文章
- Hammer.js手势库 安卓4.0.4上的问题
Hammer.JS - v1.0.7dev - 2014-02-18 1.Hammer.JS 在安卓4.0.4 , 4.1上 touchmove事件丢失 https://code.google.com ...
- 实现一个javascript手势库 -- base-gesture.js
现在移动端这么普及呢,我们在手机上可以操作更多了.对于网页来说实现一些丰富的操作感觉也是非常有必要的,对吧(如果你仅仅需要click,,那就当我没说咯...)~~比如实现上下,左右滑动,点击之类的,加 ...
- 移动开发框架,Hammer.js 移动设备触摸手势js库
hammer.js是一个多点触摸手势库,能够为网页加入Tap.DoubleTap.Swipe.Hold.Pinch.Drag等多点触摸事件,免去自己监听底层touchstart.touchmove.t ...
- 移动端手势库Hammer.js学习
感觉移动端原生支持的 touch.tap.swipe 几个事件好像还不够用,某些时候还会用到诸如缩放.长按等其他功能. 近日学习了一个手势库 Hammer.js,它是一个轻量级的触屏设备手势库,能识别 ...
- 移动开发框架,第【二】弹:Hammer.js 移动设备触摸手势js库
hammer.js是一个多点触摸手势库,能够为网页加入Tap.Double Tap.Swipe.Hold.Pinch.Drag等多点触摸事件,免去自己监听底层touchstart.touchmove. ...
- hammer.js移动端手势库
hammer.js 是一个多点触摸手势库,能够为网页加入Tap.Double Tap.Swipe.Hold.Pinch.Drag等多点触摸事件,免去自己监听底层touchstart.touchmove ...
- Hammer.js 移动端手势库,多点触控插件
jquery用法: 引入3个JS:<script src="jquery.js"></script> <script src="hammer ...
- H5案例分享:JS手势框架 —— Hammer.js
JS手势框架 -- Hammer.js 一.hammer.js简介 hammerJS是一个开源的,轻量级的触屏设备javascript手势库,它可以在不需要依赖其他东西的情况下识别触摸,鼠标事件.允许 ...
- 移动端手势事件 hammer.JS插件
一.引入hammer.JS 1.下载地址:http://download.csdn.net/detail/webxiaoma/9872249 2.官网地址:http ...
随机推荐
- Spring JdbcTemplate 调用存储过程
遇到调用存储过程的业务,以前有用过,但不是用Spring的 JdbcTemplate去做的,这次是在一个已经有的SpringMVC框架的项目下写处理存储过程的. 参考网络中的方法,在实际操作中遇到两个 ...
- set命令
set命令简介 set命令是shell中初学者比较少接触,但是却很有用的一个命令(这里我们说的shell指的是bash).set命令是shell解释器的一个内置命令,用来设置shell解释器的属性,从 ...
- 【随机化】bzoj4080 [Wf2014]Sensor Network
#include<cstdio> #include<algorithm> #include<cmath> using namespace std; typedef ...
- gulp 配置前端项目打包
项目发布时,需要对项目js文件进行压缩,混淆,连接等操作以减小项目http请求,加快访问. gulpjs.com中有很多插件可以用来配置打包部署. 需要用的常用插件有: gulp-jsmin 压缩j ...
- 尝试u3d中将代码与编辑器分离
最近与朋友交流,他一直是做端游,最近接触了u3d以后无法忍受代码与配置文件,美术资源全部纠缠在一起的状况,于是一直在琢磨怎么将编辑器与代码彻底分离. 自己也抽空研究一下,碰到一些问题先记录下来. 首先 ...
- Linq-分组统计
using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Cons ...
- python中协程的使用示例
例子1 把字符串分割为列表 def line_splitter( delimiter = None ): print( 'ready to split' ) result = None while T ...
- Bootstrap 导航栏和登陆框
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- android 连接蓝牙扫码枪,程序崩溃之onConfigurationChanged
当android手机通过蓝牙连接扫码枪时,程序崩溃的原因之一是:键盘弹出或隐藏,触发程序走了onDestory->onCreate的生命周期,从而可能使得页面的某些初始化数据被清除了. 解决方法 ...
- ecshop数据表说明
ecshop数据表说明 数据库结构说明,以及自己在后台备份不需要备份的表(红色字体是不需要备份的表)备份文件在FTP或者服务器上网站根目录下data\sqldata下 数据库采用mysql,共78张表 ...