0

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.

Ana DEV
  • 1,018
  • 2
  • 17
  • 39
  • I can't make it an answer, since I do not have a device to test it... But I just found [this documentation](https://developer.mozilla.org/en-US/docs/Web/API/Touch_events) which I think would be usefull to you. -- The trick would be to check the `touches.length` in a function called by the `touchstart` event. I guess you could be safe to disable the scroll if you have two or more. Or bind the `touchmove` event to your function... Or whatever. – Louys Patrice Bessette Sep 05 '17 at 07:58
  • I checked and is not really working @LouysPatriceBessette – Ana DEV Sep 05 '17 at 08:06
  • Can you detect the amount of fingers on touchstart? – Louys Patrice Bessette Sep 05 '17 at 08:07
  • Tried if (e.touches.length > 1){ // means 2 fingers but it do not do anything – Ana DEV Sep 05 '17 at 08:10
  • Try `if (e.changedTouches.length > 1){` ;) – Louys Patrice Bessette Sep 05 '17 at 08:12
  • 1
    No does not make sense. Page is being zoomed in – Ana DEV Sep 05 '17 at 08:17
  • Just an idea to help... If you disable the scroll on an event like on double-tap (it doesn't exist but you can detect it - [see this answer](https://stackoverflow.com/questions/24058241/touch-device-single-and-double-tap-events-handler-jquery-javascript)) Maybe? – Louys Patrice Bessette Sep 05 '17 at 08:23
  • I was checking this article just now and result is same. When i have this code added i still cant scroll down over the animated touch area – Ana DEV Sep 05 '17 at 08:25
  • 1
    You should edit your question with the HTML and relevant script for the touch area. Because what you do now, is asking about a solution you tried instead of asking about your problem. That is called an ["X/Y problem](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem). ;) Hopefully, more poeple will be able to help you. – Louys Patrice Bessette Sep 05 '17 at 08:37

0 Answers0