CODEWITHSUNDEEP
javascriptjquerytouch
Ana DEV
Ana DEV

Reputation: 1030

Activate javascript touchmove on mobile devices only when with two fingers

I have a animated area which i activated for mobile devices via javascript touchmove event but on horizontal mobile screens there is an issue of scrolling down over the animated touch area. Here is my code

jQuery(".animatedPhone").bind('touchmove', function(jQueryEvent) {});

Is there a way how i can activate the touchmove only when user uses his two fingers like google map is doing when on mobile?

I tried the below code

$(".animatedPhone").on("touchstart",function(e){
    if(!tapped){ //if tap is not set, set up single tap
        tapped = setTimeout(function(){
          tapped = null;
          //insert things you want to do when single tapped
        },300);   //wait 300ms then run single click code
    } else {    //tapped within 300ms of last tap. double tap
        clearTimeout(tapped); //stop single tap callback
        tapped = null;
        alert('double tapped');
    }
    e.preventDefault()
});

But like this again the animated touch area is not scrollable.

Thanks.

Upvotes: 0

Views: 479

Answers (1)

kuboon
kuboon

Reputation: 10201

use TouchEvent.touches.length

https://developer.mozilla.org/ja/docs/Web/API/TouchEvent/touches

$(".animatedPhone").on("touchmove",function(e){
  if (e.touches.length < 2) return;
  // bra bra
})

Upvotes: 0

Related Questions