移动端H5上划下拉

2021-08-05  本文已影响0人  深吸一口气
let start_x = start_y = end_x = end_y = 0;
let body = document.getElementByTagName("body")[0];

body.addEventListener("touchstart", function(event){
  let touch = event.targetTouches[0];
  start_x = touch.pageX;
  start_y = touch.pageY;
})

body.addEventListenner("touchmove", function(event){
  let touch = event.targetTouches[0];
  end_x = touch.pageX;
  end_y = touch.pageY;
})

body.addEventListenner("touchend", function(event){
  let move_distance_y = end_y - start_y;
  if(move_distance_y >= 100){
    // 下拉操作
  }
  if(move_distance_y <= -100){
    // 上划操作
  }
  // 重置坐标
  start_x = start_y = end_x = end_y = 0;
})
上一篇下一篇

猜你喜欢

热点阅读