IOS 5 (safari) bug with HTML touch events on “position:fixed” div

Question

I have a position:fixed div on a scrolling web page.

At first the event works, but when the page scroll, while the fixeed divs stays in place, its \"touch\" zone seems t

Answer 1

Touch events retrieve pageX and pageY - which suggests a position on the 'page' is meant. If the page is scrolled down, the Y coordinate increases and thus fixed elements will be out of reach because their y offset values stay the same. You can check wheter a fixed element has been touched on a scrolled page by this calculation:

var finger = e.touches[0];
var yCalc = finger.pageY - window.pageYOffset;
var touchedElement = document.elementFromPoint(finger.pageX, yCalc);

If you have horizontal scrolling, you have to do the same thing with the x coordinate, of course.