Changing swipe sensitivity with jQuery Mobile

Question

I'm having an issue with the iPhone and swiping to other pages. When scrolling down a page the sensitivity of the motion is touchy and will swipe to the next page. Is there a way to control swipe sensitivity within this code:

<script type="text/javascript">
$(document).ready(function(){
    var counter = 1;
    $(document).bind('swipeleft','#deal_1',function (event, ui) {
    counter++;
    if(counter>3)
    counter = 1;
    var nextpage = 'dailydeal'+counter+'.html';
    if (nextpage.length > 0) {
        $.mobile.changePage(nextpage, {transition: "slide",
        reverse: false}, true, true);
        }
    });
 $(document).bind('swiperight','#deal_1',function (event, ui) {
     counter--;
     if(counter<1)
     counter=3;
     var prevpage = 'dailydeal'+counter+'.html';
     if (prevpage.length > 0) {
         $.mobile.changePage(prevpage, {transition: "slide",
         reverse: true}, true, true);
     }
     });
  });
</script>

Nonresistance

Answer 1

To tailor this response to all devices, I would suggest setting the threshold relative to the screen width. For example:

$.event.special.swipe.scrollSupressionThreshold = (screen.availWidth) / 60;
$.event.special.swipe.horizontalDistanceThreshold = (screen.availWidth) / 60;
$.event.special.swipe.verticalDistanceThreshold = (screen.availHeight) / 13;

See jQuery Mobile API Documentation

Olio

This is an awesome answer. I used it for my app, and since then swipe in ChromeView is a bliss again. – Tatia

Awesome, this answer should get the tick! – Haldi

This is a great response and it has helped me a lot wit a problem with the jquerymobile swipes in Android, id anybody has a problem with it you can try this out. – Experimentalism

This is helpful but I'm a bit confused about horizontalDistanceThreshold = (screen.availWidth) / 60. Seems like a very low threshold... I set mine to /5 which is min 20% of the screen width. – Pice

This has to be between jquery and jquery mobile. https://mcmap.net/q/842536/-how-to-bind-quot-mobileinit-quot-event-in-jquery-mobile – Histo

Answer 2

This seems to work for the most part:

<script type="text/javascript">
    $(document).bind("mobileinit", function () {
    $.event.special.swipe.horizontalDistanceThreshold = 100;
    });
</script>

From my understanding the horizontalDistanceThreshold is set at default for 30px, so I changed it to 100. So far it seems balanced when scrolling down, and without being too sensitive.

Nonresistance