Ghost clicks setting 'click' or 'tap' option to true

[mariegauthier]

Hello,

Following this issue https://github.com/cubiq/iscroll/issues/729 about click events not working properly for iScroll elements on Android 4.3.3.

Setting the iscroll 'click' or 'tap' option to true fixed the issue, the elements are now clickable but this lead to another issue: ghost clicks. When I click on an element, then the click event somehow propagates to the element in the same area on the new page.

Do you have any idea how to remove this ghost click?

Thank you in advance.

[sebastianzillessen]

Yes, I can see that issue in my application as well. I use angularjs and ng-touch (phonegap application, 300ms delay fix).

So on one page I have a button that leads with an touch event to a next page. On this page, there is an iScroll container with tap:true set. And then I can see this ghost clicks as well.

Can anyone help us here?

[jhnns]

I'm experiencing ghost clicks too. Do you guys use Fastclick?

[ndesorden]

Hi, i'm using cordova 3.5 + angularjs + iscroll + ng-iscroll + fastclick

Setting click: true as described https://github.com/cubiq/iscroll/issues/729 i'm NOT experiencing ghost clicks

[sebastianzillessen]

Hi, yes we use Fastclick.

[jhnns]

Maybe Fastclick doesn't play well with iScroll and click: true. Need to investigate...

[ndesorden]

Are you using Fastclick + ngtouch or only fastclick ?

[jhnns]

Only Fastclick

[sebastianzillessen]

We use fast click AND ngtouch in our application.

[carlhopf]

Using fastclick and ngtouch, i get a 2nd ghostclick generated at the same location when using IScroll with the 'click' option enabled (on chrome desktop browser, works fine on mobile browsers).

I guess the original click event is not intercepted and a second one is generated by iScroll?

A solution is to use IScroll's 'tap: ...' option, but this breaks compatibility with angularjs ng-click.

[sebastianzillessen]

Yes for me as well, the tap option breaks my compatibility with angularjs.

[ndesorden]

ngtouch and fastclick remove both 300ms delay... maybe some redundancy? ngtouch is a "little" buggy, i use only fastclick (works with every links, not only ng-click) + angular-gestures (https://github.com/wzr1337/angular-gestures) for gestures

[jhnns]

Just wanted to say that with Fastclick (and without iScroll) I'm receiving ghost clicks on latest Chrome Canary, so this could be a problem of Fastclick.

[denised]

I am seeing the same problem, but with a simpler environment: I have: JQuery 1.2.1, Cordova 3.2 and iScroll 5.1.2 and nothing else of interest. (No angular, velocity, ngtouch, ...).

My app works fine in the Chrome on my desktop, but when I run it on my old Android (4.0.4) phone, a tap event usually registers twice. If a page transition happened in between the two, then the second event appears to take place on the new page (i.e. a ghost click). I see the same behavior whether I configure iScroll with tap: true or click:true.

I can't say if this just started happening or not, since I only just started testing on my phone. Haven't tried testing it on another device yet, either.

[artsmc]

So I am using Emberjs + HammerJS and getting the ghost click issue. Although I think everyone is experiencing a similar problem in that the ghost clicks come from a iscroll touchStart/mousedown event listener registering at the same time as the click,tap, etc so all events are firing twice. I have no clue how to avoid the conflict but it seems to be coming from iscroll. i was able to solve it by adjusting the options{ tap: false, click:true

[denised]

I can tell you what I did in my code: I debounce click events with a simple timeout.

One complication: it seems that if the first event handler hides/shows different parts of the DOM, then the second event is actually triggered on a different element --- so in my app it was necessary for debouncing to be global, across all touch/click events. This works for my app, YMMV.

Not elegant, and not a good solution for iscroll of course, but it is a workaround.

Denise Draper

http://sandboxconsulting.co/ http://sandboxconsulting.co

From: artsmc [mailto:notifications@github.com] Sent: Thursday, November 13, 2014 2:36 AM To: cubiq/iscroll Cc: Denise Draper Subject: Re: [iscroll] Ghost clicks setting 'click' or 'tap' option to true (#742)

So I am using Emberjs + HammerJS and getting the ghost click issue. Although I think everyone is experiencing a similar problem in that the ghost clicks come from the touchstart event listener registering at the same time as the click,tap, etc so all events are firing twice. I have no clue how to avoid the conflict between the button event and the touchstart on iscroll.

— Reply to this email directly or view it on GitHub https://github.com/cubiq/iscroll/issues/742#issuecomment-62871603 . https://github.com/notifications/beacon/ABQGTuI59VDEUKb14ZkjVgY3iUUgpxu4ks5nNID9gaJpZM4CJoNC.gif

[artsmc]

@denised I think that was my last resolve if I could find nothing else, I knew that would at least work.