Question

I’m using the “new” CSS attribute on iOS to achieve scrolling momentum, -webkit-overflow-scrolling. I have a list of <div> that you can scroll and select so that the selector vanishes and the selected item is placed elsewhere. The problem is that if the item A is on position (X,Y); I swipe up to scroll down, and while the scrolling momentum is active, I tap again on position (X,Y), where item A used to be, but now occupied by a moving upwards item B, item A is the one being selected.

A video is worth a million words: https://www.youtube.com/watch?v=mXh28IY3wIU

Is this a known bug? I am using jQuery’s mobile event ‘tap’ like so:

$selector.on('tap', '.act-item-inner', function(e){
    e.preventDefault();
    var $selected=$(this);
    [...]
}

As you would imagine, $selector is the wrapper and $selected is item B

Answer 1

While scrolling through websites on iOS the browsers

1. takes a screenshot from your site
2. and freezes the JavaScript-Engine (including all JavaScript-/DOM-Events).

So yes, this is known. But it works like designed.
You can observe this behavior by printing some messages to the console via setTimeout or setInterval. You will see that they are not executed during the elastic scrolling.

I suggest that this leads to a race condition in your particular use case when the engine is unfreezed.