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游戏之优化篇
Nov 08 Javascript
浅析LigerUi开发中谨慎载入common.css文件
Jul 09 Javascript
浅谈JavaScript 浏览器对象
Jun 03 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
Jun 17 Javascript
vue2 如何实现div contenteditable=“true”(类似于v-model)的效果
Feb 08 Javascript
angular bootstrap timepicker TypeError提示怎么办
Jun 13 Javascript
Vue-Router2.X多种路由实现方式总结
Feb 09 Javascript
vue组件(全局,局部,动态加载组件)
Sep 02 Javascript
JavaScript指定断点操作实例教程
Sep 18 Javascript
JavaScript 作用域scope简单汇总
Oct 23 Javascript
实例分析JS中的相等性判断===、 ==和Object.is()
Nov 17 Javascript
JS轮播图的实现方法2
Aug 25 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 Memcached应用实现代码
2010/02/08 PHP
关于php正则匹配汉字的方法介绍
2013/04/25 PHP
PHP多线程批量采集下载美女图片的实现代码(续)
2013/06/03 PHP
PHP依赖倒置(Dependency Injection)代码实例
2014/10/11 PHP
php socket通信简单实现
2016/11/18 PHP
PHP中trait使用方法详细介绍
2017/05/21 PHP
PHP进阶学习之类的自动加载机制原理分析
2019/06/18 PHP
PHP中SESSION过期设置
2021/03/09 PHP
Javascript 获取滚动条位置等信息的函数
2009/09/08 Javascript
JS如何将UTC格式时间转本地格式
2013/09/04 Javascript
JavaScript 数组详解
2013/10/10 Javascript
JQuery中extend使用介绍
2014/03/13 Javascript
jQuery的css() 方法使用指南
2015/05/03 Javascript
JS 实现倒计时数字时钟效果【附实例代码】
2016/03/30 Javascript
BootStrap tooltip提示框使用小结
2016/10/26 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
2017/06/17 Javascript
jQuery之动画ajax事件(实例讲解)
2017/07/18 jQuery
基于webpack-hot-middleware热加载相关错误的解决方法
2018/02/22 Javascript
在react中使用vuex的示例代码
2018/07/30 Javascript
vue实现下拉菜单树
2020/10/22 Javascript
javascript实现简单页面倒计时
2021/03/02 Javascript
Python3.6笔记之将程序运行结果输出到文件的方法
2018/04/22 Python
Python解决两个整数相除只得到整数部分的实例
2018/11/10 Python
Python3爬虫全国地址信息
2019/01/05 Python
python mac下安装虚拟环境的图文教程
2019/04/12 Python
pyqt5 实现工具栏文字图片同时显示
2019/06/13 Python
对python3 sort sorted 函数的应用详解
2019/06/27 Python
python被修饰的函数消失问题解决(基于wraps函数)
2019/11/04 Python
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
世界最大的票务市场:viagogo
2017/02/16 全球购物
如何写一个自定义标签
2012/12/28 面试题
工程专业求职自荐书范文
2014/02/08 职场文书
乱丢垃圾袋检讨书
2014/10/08 职场文书
法定代表人身份证明书
2015/06/18 职场文书
《包身工》教学反思
2016/02/23 职场文书
Golang 入门 之url 包
2022/05/04 Golang