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 相关文章推荐
jQuery中prop()方法用法实例
Jan 05 Javascript
Javascript控制input输入时间格式的方法
Jan 28 Javascript
干货分享:让你分分钟学会javascript闭包
Dec 25 Javascript
Bootstrap入门书籍之(五)导航条、分页导航
Feb 17 Javascript
localStorage实现便签小程序
Nov 28 Javascript
vue数据双向绑定的注意点
Jun 23 Javascript
通过jquery toggleClass()属性制作文章段落更改背景颜色
May 21 jQuery
vue+element UI实现树形表格带复选框的示例代码
Apr 16 Javascript
Vue.extend实现挂载到实例上的方法
May 01 Javascript
Vue实现剪切板图片压缩功能
Feb 04 Javascript
JavaScript实现简单的图片切换功能(实例代码)
Apr 10 Javascript
react国际化react-intl的使用
May 06 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
PHP+MySQL 制作简单的留言本
2009/11/02 PHP
php zip文件解压类代码
2009/12/02 PHP
php防止恶意刷新与刷票的方法
2014/11/21 PHP
PHP+jquery+CSS制作头像登录窗(仿QQ登陆)
2016/10/20 PHP
PHP+iframe图片上传实现即时刷新效果
2016/11/18 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
Javascript中eval函数的使用方法与示例
2007/04/09 Javascript
seajs1.3.0源码解析之module依赖有序加载
2012/11/07 Javascript
解析Javascript中大括号“{}”的多义性
2013/12/02 Javascript
Javascript优化技巧之短路表达式详细介绍
2015/03/27 Javascript
浅析Ajax语法
2016/12/05 Javascript
Vue按需加载的具体实现
2017/12/02 Javascript
react redux入门示例
2018/04/19 Javascript
JS中this的指向以及call、apply的作用
2018/05/06 Javascript
vue element动态渲染、移除表单并添加验证的实现
2019/01/16 Javascript
微信小程序实现商品属性联动选择
2019/02/15 Javascript
jQuery实现简单聊天室
2020/02/08 jQuery
vue操作dom元素的3种方法示例
2020/09/20 Javascript
[02:07]2018DOTA2亚洲邀请赛主赛事第三日五佳镜头 fy极限反杀
2018/04/06 DOTA
Python解惑之整数比较详解
2017/04/24 Python
Python实现的人工神经网络算法示例【基于反向传播算法】
2017/11/11 Python
python pandas dataframe 行列选择,切片操作方法
2018/04/10 Python
python打包exe开机自动启动的实例(windows)
2019/06/28 Python
python根据多个文件名批量查找文件
2019/08/13 Python
python实现图片二值化及灰度处理方式
2019/12/07 Python
pyinstaller打包成无控制台程序时运行出错(与popen冲突的解决方法)
2020/04/15 Python
Python小白学习爬虫常用请求报头
2020/06/03 Python
Philosophy美国官网:美国美容品牌
2016/08/15 全球购物
伦敦著名的运动鞋综合商店:Footpatrol
2019/03/25 全球购物
大学生职业生涯规划方案
2014/01/03 职场文书
纺织工程专业个人求职信范文
2014/01/27 职场文书
优秀社区干部事迹材料
2014/02/03 职场文书
交通安全寄语大全
2014/04/08 职场文书
促销活动总结怎么写
2014/06/25 职场文书
寒山寺导游词
2015/02/03 职场文书
php中配置文件保存修改操作 如config.php文件的读取修改等操作
2021/05/12 PHP