My implementation works great with a mouse where I can use a delegated jQuery on("mousemove","*") handler to detect when the user mouses over something and this triggers an action.
I want to do the same for multi-touch, if the user drags their finger across a child element I want a delegated touchmove handler to pick it up. However it seems like only the callback of the container element ever gets called as the finger is dragged around on that container (and over its child elements).
Is there some way I can accomplish this without writing a point-in-rect test using JS?
Notice how on a PC when you click-drag across the B DIV it gets turned red correctly.
On an iOS device (with debug console enabled) you can only get it to show up blue (by tapping inside the 'B' div). I want to be able to drag over something and "pick it up".
Behavior is also identical on a Nexus 7 Android 4.1.1 tablet with (Mobile) Chrome.
It would appear that a previous discussion provides an unsatisfactory but workable solution to my problem: