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 对话框和状态栏使用说明
Oct 25 Javascript
十分钟打造AutoComplete自动完成效果代码
Dec 26 Javascript
JavaScript Event学习第三章 早期的事件处理程序
Feb 07 Javascript
基于Jquery+div+css实现弹出登录窗口(代码超简单)
Oct 27 Javascript
学习JavaScript设计模式(链式调用)
Nov 26 Javascript
JavaScript知识点总结(十一)之js中的Object类详解
May 31 Javascript
BootStrap注意事项小结(五)表单
Mar 10 Javascript
JS路由跳转的简单实现代码
Sep 21 Javascript
实现单层json按照key字母顺序排序的示例
Dec 06 Javascript
Koa2微信公众号开发之本地开发调试环境搭建
May 16 Javascript
对Layer UI 模块化的用法详解
Sep 26 Javascript
解决qrcode.js生成二维码时必须定义一个空div的问题
Jul 09 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动态生成虚拟现实VRML网页
2006/10/09 PHP
echo, print, printf 和 sprintf 区别
2006/12/06 PHP
解析PHP中empty is_null和isset的测试
2013/06/29 PHP
实现WordPress主题侧边栏切换功能的PHP脚本详解
2015/12/14 PHP
浅谈PHP中的数据传输CURL
2016/09/06 PHP
PHP安装BCMath扩展的方法
2019/02/13 PHP
mongodb和php的用法详解
2019/03/25 PHP
JavaScript Event学习第六章 事件的访问
2010/02/07 Javascript
浅析JQuery中的html(),text(),val()区别
2014/09/01 Javascript
你有必要知道的25个JavaScript面试题
2015/12/29 Javascript
javascript时间差插件分享
2016/07/18 Javascript
原生js实现秒表计时器功能
2017/02/16 Javascript
jquery Ajax实现Select动态添加数据
2017/06/08 jQuery
vue中子组件传递数据给父组件的讲解
2019/01/27 Javascript
利用vue-i18n实现多语言切换效果的方法
2019/06/19 Javascript
vant 解决tab切换插件标题样式自定义的问题
2020/11/13 Javascript
使用jquery实现轮播图效果
2021/01/02 jQuery
初学python数组的处理代码
2011/01/04 Python
python实现sublime3的less编译插件示例
2014/04/27 Python
Python 爬虫学习笔记之正则表达式
2016/09/21 Python
python文件选择对话框的操作方法
2019/06/27 Python
python的slice notation的特殊用法详解
2019/12/27 Python
python使用pymongo与MongoDB基本交互操作示例
2020/04/09 Python
Python Selenium操作Cookie的实例方法
2021/02/28 Python
英国时尚和家居用品零售商:Matalan
2021/02/28 全球购物
高一化学教学反思
2014/02/05 职场文书
代领毕业证委托书
2014/08/02 职场文书
公司优秀员工获奖感言
2014/08/14 职场文书
自我管理的活动方案
2014/08/25 职场文书
师德师风学习材料
2014/12/19 职场文书
2015年学生会工作总结范文
2015/03/31 职场文书
酒店财务部岗位职责
2015/04/14 职场文书
百家讲坛观后感
2015/06/12 职场文书
Java 将PPT幻灯片转为HTML文件的实现思路
2021/06/11 Java/Android
MySQL数据库必备之条件查询语句
2021/10/15 MySQL
分析Python list操作为什么会错误
2021/11/17 Python