jquery如何利用mousedown、mousemove和mouseup等事件来实现手势识别

jquery开发中如何利用mousedown、mousemove和mouseup等事件来实现手势识别，下面web建站小编给大家简单介绍一下具体实现代码！

具体代码如下：

var startX, startY, endX, endY;
 
$(document).on('mousedown', function(e) {
  startX = e.clientX;
  startY = e.clientY;
});
 
$(document).on('mousemove', function(e) {
  endX = e.clientX;
  endY = e.clientY;
 
  var direction = swipeDirection(startX, startY, endX, endY);
});
 
$(document).on('mouseup', function(e) {
  endX = e.clientX;
  endY = e.clientY;
 
  var direction = swipeDirection(startX, startY, endX, endY);
});
 
function swipeDirection(startX, startY, endX, endY) {
  var diffX = Math.abs(startX - endX);
  var diffY = Math.abs(startY - endY);
 
  if (diffX > diffY) {
    return (startX > endX) ? 'left' : 'right';
  } else {
    return (startY > endY) ? 'up' : 'down';
  }
}

jQuery检测指定链接（URL）是否有效（包含跨域）

jQuery语法判断元素是否有子元素的代码？

jQuery语法判断元素是否具有某个特定属性的方法？

jQuery语法如何实现table隔行交替背景色（具体代码介绍）

jQuery语法如何实现表格隔行变色效果

标签： jquery语法, mousedown, mousemove, mouseup

上面是“jquery如何利用mousedown、mousemove和mouseup等事件来实现手势识别”的全面内容，想了解更多关于 js 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_4624.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！