移动端滑动事件冲突(既有上下又有左右,斜滑时会相互影响)

我们会遇见一个问题,就是当div既有上下滑动又有左右滑动时,我们斜滑会页面也会斜着运动,这不是我们想要的,我们只想它向上或者向左滑动

在这里我给大家提供一个思路,很简单的一个想法我们可以通过滑动的距离预判用户是左右滑动,还是上下滑动 | y | <= | x |

如果水平移动距离 > 垂直移动距离 就是做水平滑动,反之就是垂直滑动

$('div').on('touchmove',function( event){
    this.offsetX = event.originalEvent.targetTouches[0].pageX -         this.startX;
     this.offserY = event.originalEvent.targetTouches[0].pageY - this.startY;
      if( Math.abs(offsetY) <= Math.abs(offsetX)){
                //左右滑动
      }else {
            //上下滑动
      }
}
        
原文地址:https://www.cnblogs.com/ryze/p/ryze18.html