Skarbo
Skarbo

Reputation: 707

Creating a bind that supports touch and click

I'm looking for a bind that binds "touchstart" for touch devices and "click" for desktop devices.

Binding "click" on some touch devices gives a 500ms delay before the click is handled.

Separating touch devices from desktop with "typeof window.ontouchstart" does not work anymore as major browsers now support touch (jQuery TouchClick), but a click with a mouse does not emulate a touch event.

jQuery Mobile has this feature, as suggested here, but I'm looking for a stripped down jQuery plugin for this feature without using the jQuery Mobile framework.

Upvotes: 1

Views: 412

Answers (2)

tuxracer
tuxracer

Reputation: 201

If you upgrade to the latest version of jquery-touchclick it now supports both.

Upvotes: 0

Graham
Graham

Reputation: 6562

What about binding both, then when a touch is triggered, ignore the subsequent click event?

var ignoreClick = false;

function touchOrClick(e){
    if (e.type == 'click'){
        if (ignoreClick){
            ignoreClick = false;
            return;
        }
    } else {
        ignoreClick = true;
    }
    // do stuff
}

node.addEventListener('ontouchstart', touchOrClick, false);
node.addEventListener('onclick', touchOrClick, false);

Upvotes: 1

Related Questions