iPad touch events on <video> tag

Question

I'm building a javascript-powered gallery on the iPad that can display both images and video. To browse the gallery, you can swipe left or right (similar to the iPad's Photo application). However, none of my touch events work when swiping over a <video> element. It seems to take over my touch events, even on elements that may have a higher z-index. I have tried adding a touchmove handler that calls e.preventDefault(), but that doesn't seem to work either. Has anyone else run into this problem and found a solution for it?

Answer 1

Your touch events are being absorbed by the default controls of the player. If you set the video element's controls to false you can have full control of the events on the video element. But doing this means you'll have to implement your own custom controls, which isn't very hard.