CODEWITHSUNDEEP
jquerymobileswipe
Allen B.
Allen B.

Reputation: 213

Changing swipe sensitivity with jQuery Mobile

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>

Upvotes: 7

Views: 9838

Answers (2)

user2573644
user2573644

Reputation: 261

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

Upvotes: 20

Allen B.
Allen B.

Reputation: 213

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.

Upvotes: 7

Related Questions