Scroll originating on video element does not work on iOS devices


#1

If you run this CodePen http://codepen.io/cnanders/pen/sHuAI (forked version of Starter Template 1.0.0-beta with a simple video mp4 in the content) from a desktop browser and originate a “scroll” on the video (in code pen, click your mouse on the video, start dragging and release), it works. However when this same CodePen is run from Mobile Safari, or as a compiled native app, and you originate a touch scroll from the video, it does not work.


#2

Have you changed it since you posted? Does not work for me at all in Chrome. I can’t drag the volume or timeline.


#3

I also can’t drag the volume or timeline with my mouse in CodePen. The original bug still stands, however, which has to do with scrolls originating from over the video area. If you view that CodePen from desktop Chrome or Safari, if you click in the video, hold, drag, and release, the page moves with the drag. If you view this same CodePen from an iPhone/iPad and start a drag with your finger over the video, it doesn’t work. My app is a book with text / videos on each page so I notice this bug often. I’ve noticed if the ion-content directive has overflow-scroll property set to “true” (not the default), it works so it must be something to do with your “ionic scrolling” algorithm not registering touch events on the video element.


#4

Ughhh… this is an ugly one. A while back Max fixed the scrollView so that embedded objects could be clickable. That problem is related to this but not quite the same.

I’ve opened Issue # 1120 for this :


#5

Thanks for reporting this, I’ll be sure to test video elements with our latest changes which are not in master yet. We’re shooting to have most of our keyboard focus, tap/click and scroll fixes in beta2, thanks.


#6

Just want to let you know this is still an issue as of beta.3 americium


#7

This is also a problem for me. Is there a way of just disabling scroll on the video element?