touchstart too sensitive

Question

I am using this awesome bit of code to simulate touch events on Android http://pervasivecode.blogspot.co.nz/2011/11/android-phonegap-active-css-pseudo.html. Works great but is too sensitive. For example if you have a list and want to scroll down when you touch anything on the list that is a link it highlights.

$(document).ready(function(){
if (navigator.userAgent.toLowerCase().indexOf("android") > -1) {
$('a')
.bind("touchstart", function () {
    $(this).addClass("fake-active");

       })
.bind("touchend", function() {
    $(this).removeClass("fake-active");
  });
 }
    });

Would it possible to delay the class change or is there another trigger I could use?

Answer 1

To avoid activating links when scrolling, you could use touchend to trigger the class change, and to check for scrolling if present. Something like this...

if (navigator.userAgent.toLowerCase().indexOf("android") > -1){

    var scroll = 0;
    $('a').on("touchstart",function(){
        $('a').removeClass("fake-active");
    }).on("touchend",function(){
        if(scroll == 0){
            $(this).addClass("fake-active");
        }
        scroll = 0; //Ideally should be set when scrolling is finished
    });

    $('ELEMENT-THAT-IS-SCROLLING').scroll(function(){
    scroll = 1;
    });

}