jQuery Forum

However the 300ms delay on clicks is driving me crazy.

Elephant. Room.

Hi,

Sorry, I forget sometimes this is an international audience.

There is a phrase, "The elephant in the room", It's some huge thing that is obvious, but nobody wants to really talk about. So, it's not that nothing can be done about it, but that nobody WANTS to do anything about it. Or, the solution might be daunting.

A co-worker once elaborated on the metaphor for an issue that was particularly odious, and provided a cartoon illustration. I believe she characterized a task as:

The elephant in the room, sitting in the corner, smoking crack, and laughing at you.

The 300mSec delay is that kind of elephant.

We already have normalized touch/mouse events in the vmouse feature:

The issue is that Android is a mess with events so if tapping will re-paint the screen the mouse and touch targets may not match and it will appear like there is a double click happening so we don't use this for things navigation.

Todd, if you are developing specifically for a mobile application - so that there is no need for mouse events - then would using the "tap" event, rather than "vclick" - (and disabling the click event) circumvent the Android fallout?

As well, many developers may not be targeting Android, and so the solution that was previously present but removed would still be useful to those developers - for example, those developing for iOS only.

I do realize that it's possible (though not common) to have a mouse on mobile devices using Bluetooth accessories, maybe some oddball devices with hardware buttons/trackball, etc. But a tap-only solution would still be acceptable for a wide range of apps. (For, say, a word processor, it might be important to preserve mouse compatibility.)

When you say mobile app, do you mean "iOS app only"? If that's the case, you can tweak your event binding as you see fit and test like crazy. The 300ms click lag is a pain for sure, but it's there to disambiguate between scrolling, extended tap, etc. and is very reliable across all browsers. Binding to touch events is faster, but there are a lot of things to consider. This is a decent article on the topic, but be sure to read the comments to see the issues and possible solutions.

When you say mobile app, do you mean "iOS app only"?

No, I meant mobile, as opposed to desktop. As in, "a device that doesn't have a mouse or hardware clicker buttons."

As well, I'm assuming no need for double-taps. I think they are rare in mobile apps.

That said, I'd be happy (er) with an iOS-only solution. It would solve the problem for one of two platforms that are the most common mobile targets.

Mobile devices have a huge range of events, it's not just touch. iOS and Android 4 are pure touch, but older android also has a roller navigator that is like tabbing through the interface, Blackberry phones have a real on-screen pointer like desktop and can have touch or only pointer input, WP7/WebOS and others are touch based but only emit mouse events, etc. 

Hi again,

I did a quick workaround for my own little purpose, it might help other ppl:

1. (function($, undefined) {
2.   function triggerCustomEvent( obj, eventType, event ) {
3.     var originalType = event.type;
4.     event.type = eventType;
5.     $.event.handle.call( obj, event );
6.     event.type = originalType;
7.   }
8.   $.event.special.fastclick = {
9.     setup: function() {
10.       var thisObject = this,
11.           $this = $( thisObject );
12.       $this.on('vclick.fastclick', function(ev) {
13.         ev.preventDefault();
14.         triggerCustomEvent(thisObject, 'fastclick', ev);
15.       });
16.     }
17.   };
18. })(jQuery);

I too have played with various work-arounds in both jQM and jQTouch, and everything I've used is buggy. You get a lot of double-clicking, or worse, it works great unless your user happens to start clicking on the button more than once.

The best I can come up with is use normal click for navigation purposes but when you can, use "touchend". I get a much faster response. I typically bind my user feedback (sound effects or graphic changes) to the touchstart event, and the actual activity to touchend.

---
http://zsprawl.com

Hi there,

sorry for bringing up this old thread, but I wrote a plugin that nicely integrates into jquery, with or without jquerymobile, to support fast clicks. So if you're still looking for something, try:

https://github.com/Plaputta/jquery.event.special.fastclick

It also tries to prevent ghost clicks - working fine on iOS, yet a little buggy on android.
You can use it like any other event: $('#button').on('fastclick', function() {}); etc...

Toby

Wait, so with jQM I don't actually need FastClick?