Amphtml: amp-video: video pauses when wrapped by position fixed element

[infillrc]

What's the issue?

amp-video pauses if it's wrapped by a container with style-attribute "position: fixed" and the user scrolls down the content.

How do we reproduce the issue?

Example: https://jsbin.com/hisotev/edit?html,output

Instructions for reproducing the issue:

1. Open the example
2. Scroll down to at least 1/4 of the page (or to bottom of the page)
3. You see that the video pauses

What browsers are affected?

All browsers

Which AMP version is affected?

AMP ⚡ HTML – Version 2009190410002

Intention

Use a video as a fullscreen background animation.

Expected behavior

amp-video continues no matter where you are on the page

Occurred behavior

amp-video stops as soon the user scrolls down

Assumption what could cause the issue

amp-video has a listener, that pauses the video, as soon the video is 50% out of view.

Already tried:

Stack Overflow Posts with the same behavior

https://stackoverflow.com/a/50455438

Instructions for reproducing the issue (in the stack overflow post):

1. Open the example
2. "Run code snippet"
3. Scroll down to at least 1/4 of the page (or to bottom of the page)
4. You see that the video pauses

Workarounds that creates other issues

https://jsbin.com/cedukix/edit?html,output
Move the body scroll behavior to the ".page-content" element. So the whole site is not scrolled anymore with the scrollbars, rather with the scrollbars of the ".page-content" element.

1. issue: Scrollbars were overlapped by the fixed menus, but that was solved by setting the right z-index.
2. issue: Page can not be scrollen, when the mouse focuses one of the fixed menus. "mouse-events: none" fixes this, but then no menu item can be clicked.

[philkrie]

+1, is there a workaround currently available for this? If not, it'd be great if this behaviour could be modified with an attribute.

[alanorozco]

@infillrc @philkrie

The AMP runtime has a few issues determining visibility for components inside position: fixed elements. amp-video only autoplays when it's sure it's visible by >50%.

We're changing how this works internally so that we use an IntersectionObserver instead, which shouldn't have that issue.

As for now, there's no way to disable this behavior via markup. Apologies!

[spormeon]

I have a similar issue to this but my video is in a side rail and is basically always 90%+ viewable, how can I stop it pausing on scroll down?

I'm using amp-ima-video

[samouri]

Noting here that this issue should be resolved via: https://github.com/ampproject/amphtml/pull/30647

[infillrc]

I can confirm that the issue has been resolved. Thank you very much.
(AMP ⚡ HTML – Version 2010272236000 nightly-channel enabled)