Description
Some properties that apply to scroll containers are propagated to the viewport. Examples are scroll-padding
and scroll-snap-type
: #3740 and overflow-* properties: https://drafts.csswg.org/css-overflow/#overflow-propagation
Could we propagate the perspective
property as well?
Motivation
The perspective property is often used to create a parallax scrolling effect. To achieve this effect overflow-x
and perspective
is set on the body
element make it a scroll container and the reference box for css transforms. Translating children in the z-axis creates a parallax effect when scrolling.
A full description of how to achieve this can be found here: https://redstapler.co/css-parallax-scrolling-effect/
Also described here: https://developers.google.com/web/updates/2016/12/performant-parallaxing
Making body
a scroll container degrades the user experience especially on mobile devices. Browser chrome does not move out of the way when the user scrolls down the page.
If perspective on the root element propagated to the viewport, the parallax effect could be achieved without creating a new scroll container?