/*判断上下滑动:*/
$('body').bind('touchstart',function(e){
startX = e.originalEvent.changedTouches[0].pageX;
startY = e.originalEvent.changedTouches[0].pageY;
});
$("body").bind("touchmove",function(e){
//获取滑动屏幕时的X,Y
endX = e.originalEvent.changedTouches[0].pageX;
endY = e.originalEvent.changedTouches[0].pageY;
//获取滑动距离
distanceX = endX-startX;
distanceY = endY-startY;
//判断滑动方向
if(Math.abs(distanceX)>Math.abs(distanceY) && distanceX>0){
console.log('往右滑动');
}else if(Math.abs(distanceX)>Math.abs(distanceY) && distanceX<0){
console.log('往左滑动');
}else
if(Math.abs(distanceX)<Math.abs(distanceY) && distanceY<0){
console.log('往上滑动');
} else if(Math.abs(distanceX)<Math.abs(distanceY) && distanceY>0){
console.log('往下滑动'); }
});

  

web移动前端页面,jquery判断页面滑动方向的更多相关文章

  1. jquery判断手指滑动方向

    jquery判断手指滑动方向 <pre> /*判断哪个滑动方向还是自己改下 要么上下 要么左右*/ var startX; var startY; $(".shanghua&qu ...

  2. jquery 判断手势滑动方向(上下左右)

    $('body').on('click', '.placeholder img', function(e) { //touchstart在你之前发生,不管些什么,都先执行下面的 }); $('body ...

  3. 对于移动端浏览器touch事件的研究总结(4)判断手指滑动方向

    最近有一些微信的项目,虽然页面很简单,但配合手势后的效果却是很不错的.最基本的效果就是手指向上滑,页面配合css3出现一个展开效果,手指向下滑将展开的内容按原路径收起.其实就是一个简单的判断手指滑动方 ...

  4. 《移动端浏览器Touch事件判断手指滑动方向方法》

    $("body").on("touchstart", function(e) {     e.preventDefault();     startX = e. ...

  5. [jquery]判断页面滚动到顶部和底部(适用于手机web加载)

    //判断页面滚动到顶部和底部 $(window).scroll(function(){ var doc_height = $(document).height(); var scroll_top = ...

  6. jquery判断页面网址是否有效

    方法一:(jQuery方法: 适用所有浏览器) HTML页面: <!DOCTYPE html><html><head lang="en"> &l ...

  7. jQuery 判断页面元素是否存在的代码

    在原生的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: document.getElementById(& ...

  8. jquery判断页面元素是否存在

    在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: document.getElementById(& ...

  9. 第四篇:web之前端之jquery

    前端之jquery   前端之jquery 本节内容 jquery简介 选择器和筛选器 操作元素 示例 1. jquery简介 1 jquery是什么 jQuery由美国人John Resig创建,至 ...

随机推荐

  1. (笔记)Linux下的准确延时,#include <linux/delay.h>调用出错

    在编写应用层程序时,有时需要延时一下,这个时候该怎么办呢? 在内核代码中,我们经常会看到这样的头文件使用#include <linux/delay.h>,心想着直接调用这个就可以了吧!可是 ...

  2. e617. Determining the Opposite Component of a Focus Event

    The opposite component is the other component affected in a focus event. Specifically, in a focus-lo ...

  3. ubuntu -- 安装最新版的nodejs

    1.安装最新的nodejs和npm # apt-get update # apt-get install -y python-software-properties software-properti ...

  4. IE8不支持数组的indexOf方法

    在IE8下有个js错误,但是在其它浏览器下(Firefox, Chrome, IE9)下面都很正常.后来调试发现原因是在IE8下,js数组没有indexOf方法. 在使用indexOf方法前,执行一下 ...

  5. vi编辑器的使用方式

    vi编辑器是所有Unix及Linux系统下标准的编辑器,它的强大不逊色于任何最新的文本编辑器,这里只是简单地介绍一下它的用法和一小部分指令.由于对Unix及Linux系统的任何版本,vi编辑器是完全相 ...

  6. JSTL时间格式化项目小试

    我在之前的博客中虽然详尽的介绍了JSTL在各个载体中的用法,也介绍了它和EL的共同使用的好处,但是只是顺便提了一下JSTL的格式化. 今天在项目中遇到了一个小问题,也就想到这,马上就开始实践了一下,效 ...

  7. mongo数据库命令简单学习

    db.getCollection('product').update({status:"offline"},{$set:{status:"online"}},f ...

  8. linux shell搜索某个字符串,然后在后面加上字符串?字符串后面插入字符串?sed字符串后面插入字符串?

    需求描述: 今天在配置nrpe.cfg这个文件,里面有allowed_hosts的IP地址,需要加上监控主机的地址,所以首先要搜索 到这个地址,然后呢,加上监控主机的地址,考虑通过sed命令来实现 操 ...

  9. mysql中json_merge函数的使用?

    需求描述: 通过mysql中的json_merge函数,可以将多个json对象合并成一个对象 操作过程: 1.查看一张包含json列的表 mysql> select * from tab_jso ...

  10. 解决sourcesafe admin用户自动登录并且不用密码的问题

    用管理员(admin)登录Microsoft   Visual   SourceSafe   Administration tools-> "SourceSafe   Options界 ...