Question

I have a jQuery mobile list. I'd like to make the list elements highlight when the user touches them. I tried to implement this using:

$("#id").bind('touchstart tap', function () {
    $("#id").css('background', 'blue');
    window.setTimeout(function () {
        $("#" + fbId).css('background', 'hsl(0, 0%, 93%)');
    }, 65);
}

This works only too well. When the user scrolls the it doesn't differentiate between the scroll and touch start and the element lights up. Can anyone suggest a cleaner way of accomplishing this?

Was it helpful?

Solution

The handlers below did the trick.

   $("#" + Id).bind('touchstart', function () {
        $("#" + Id).css('background', 'highlight-color');
    });

    $("#" + Id).bind('touchend', function () {
        $("#" + Id).css("background", "original-color");
    });
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top