jquery实现相册一下滑动两次的方法


Posted in Javascript onFebruary 09, 2015

本文实例讲述了jquery实现相册一下滑动两次的方法。分享给大家供大家参考。具体实现方法如下:

var t1=null; //定义为全局变量

$('body').on('touchstart', '#gallerySlider img', function(e){
var touch = e.originalEvent,
startX = touch.changedTouches[0].pageX;
if (t1 == null){
    t1 = new Date().getTime();
}else{    
    var t2 = new Date().getTime();
    if(t2 - t1 < 500){
      t1 = t2;
      return;
    }else{
      t1 = t2;
    }
}

slider.on('touchmove',function(e){
event.stopPropagation();
touch = e.originalEvent.touches[0] ||
e.originalEvent.changedTouches[0];

if(touch.pageX - startX > 10){
slider.off('touchmove');
showPrevious();
}
else if (touch.pageX - startX < -10){
slider.off('touchmove');
showNext();
}
});
return false;
}).on('touchend',function(){
slider.off('touchmove');
});

当手指滑动开始的时候记录下时间,结束的时候在记录下时间,如果两个时间差相隔很近,就结束。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript国旗变换效果代码
Aug 13 Javascript
我的Node.js学习之路(二)NPM模块管理
Jul 06 Javascript
javascript通过元素id和name直接取得元素的方法
Apr 28 Javascript
JS利用cookie记忆当前位置的防刷新导航效果
Oct 15 Javascript
基于javascript bootstrap实现生日日期联动选择
Apr 07 Javascript
jQuery使用ajax_动力节点Java学院整理
Jul 05 jQuery
react实现点击选中的li高亮的示例代码
May 24 Javascript
js统计页面上每个标签的数量实例代码
May 29 Javascript
给localStorage设置一个过期时间的方法分享
Nov 06 Javascript
JSON字符串操作移除空串更改key/value的介绍
Jan 05 Javascript
vue实现同时设置多个倒计时
May 20 Vue.js
gojs实现蚂蚁线动画效果
Feb 18 Javascript
js点击选择文本的方法
Feb 09 #Javascript
JS动态加载当前时间的方法
Feb 09 #Javascript
JavaScript实现Java中StringBuffer的方法
Feb 09 #Javascript
angularJS 入门基础
Feb 09 #Javascript
javascript中函数作为参数调用的方法
Feb 09 #Javascript
javascript自动生成包含数字与字符的随机字符串
Feb 09 #Javascript
angularJS 中$scope方法使用指南
Feb 09 #Javascript
You might like
将数字格式的计算结果转为汉字格式
2006/10/09 PHP
PHP备份/还原MySQL数据库的代码
2011/01/06 PHP
Windows中使用计划任务自动执行PHP程序实例
2014/05/09 PHP
PHP命令空间namespace及use的用法小结
2017/11/27 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
Extjs学习笔记之五 一个小细节renderTo和applyTo的区别
2010/01/07 Javascript
js函数调用常用方法详解
2012/12/03 Javascript
js jquery验证银行卡号信息正则学习
2013/01/21 Javascript
Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法
2013/08/08 Javascript
Javascript 实现的数独解题算法网页实例
2013/10/15 Javascript
JavaScript获取伪元素(Pseudo-Element)属性的方法技巧
2015/03/13 Javascript
js格式化输入框内金额、银行卡号
2016/02/01 Javascript
JS中使用 after 伪类清除浮动实例
2017/03/01 Javascript
BootStrap daterangepicker 双日历控件
2017/06/02 Javascript
js判断传入时间和当前时间大小实例(超简单)
2018/01/11 Javascript
vue input输入框关键字筛选检索列表数据展示
2020/10/26 Javascript
10种检测Python程序运行时间、CPU和内存占用的方法
2015/04/01 Python
Python 详解基本语法_函数_返回值
2017/01/22 Python
Python编程之列表操作实例详解【创建、使用、更新、删除】
2017/07/22 Python
python 以16进制打印输出的方法
2018/07/09 Python
使用python批量读取word文档并整理关键信息到excel表格的实例
2018/11/07 Python
基于Python的PIL库学习详解
2019/05/10 Python
Python搭建Spark分布式集群环境
2019/07/05 Python
Python传递参数的多种方式(小结)
2019/09/18 Python
python GUI库图形界面开发之PyQt5布局控件QGridLayout详细使用方法与实例
2020/03/06 Python
手把手教你用Django执行原生SQL的方法
2021/02/18 Python
HTML5 canvas基本绘图之文字渲染
2016/06/27 HTML / CSS
美国殿堂级滑板、冲浪、滑雪服装品牌:Volcom(钻石)
2017/04/20 全球购物
电子商务专业学生的学习自我评价
2013/10/27 职场文书
会计学应届毕业生推荐信
2013/11/04 职场文书
交通事故检查书范文
2014/01/30 职场文书
小学学校门卫岗位职责
2014/08/03 职场文书
家庭贫困证明范本(经典版)
2014/09/22 职场文书
内乡县衙导游词
2015/02/05 职场文书
golang 实现时间戳和时间的转化
2021/05/07 Golang
图片批量处理 - 尺寸、格式、水印等
2022/03/07 杂记