Lost click event on any link due to handling touchstart and touchend events - jQuery

Asked Aug 05 '20 at 15:23

Active Aug 06 '20 at 16:15

Viewed 281 times

Hi I am using touchstart and touchend to detect scroll on mobile browser.

//Detect Scroll on Mobile//
var ts;
$(document).bind('touchstart', function (e){
   ts = e.originalEvent.touches[0].clientY;
});

$(document).bind('touchend', function (e){
  //e.preventDefault();
   var te = e.originalEvent.changedTouches[0].clientY;
   if(ts > te+5){
      next_slide();
   }else if(ts < te-5){
      e.preventDefault();
      prev_slide();
   }
});

The scroll is working perfectly but none of the links are working when I click them. I believe, this is because, I am capturing touchstart event and it may not be firing click event.

Not sure how to keep my scroll function as is without affecting other links.

By the way, it is working perfectly when I inspect it on desktop chrome. Maybe due to mouseclick event.

edited Aug 06 '20 at 16:15

asked Aug 05 '20 at 15:23

krushna ratnaparkhi

Have you tried `$(window).on("touchmove"` instead? – imvain2 Aug 05 '20 at 15:26
Also, I'm sure it is `e.preventDefault();` that is breaking the links themselves. – imvain2 Aug 05 '20 at 15:27
tried touchmove but it does not give scroll direction - up or down. And general preventdefault is commented. I am using it in the second if, just to prevent chrome's pull-to-refresh function. – krushna ratnaparkhi Aug 05 '20 at 15:30
Could you replicate this in a pen on CodePen.io for us to fork and play with? – Brandon McConnell Aug 06 '20 at 16:20
@BrandonMcConnell you can check the code here : https://codepen.io/krushnar/pen/qBZdaEE – krushna ratnaparkhi Aug 09 '20 at 07:38

Lost click event on any link due to handling touchstart and touchend events - jQuery

0 Answers0