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?
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?
Share Improve this question asked Aug 12, 2010 at 16:19 mbxtrmbxtr 2,3131 gold badge15 silver badges12 bronze badges1 Answer
Reset to default 19Your 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.