Description An attribute that enables a 3D-perspective effect on an element.
Availability Experimental
Required Script <script async custom-element="amp-fx-parallax" src="https://cdn.ampproject.org/v0/amp-fx-parallax-0.1.js"></script>
Examples Annotated code example for amp-fx-parallax

Behavior

The amp-fx-parallax attribute causes an element to move as if it is nearer or farther relative to the foreground of the page content. As the user scrolls the page, the element scrolls faster or slower depending on the value assigned to the attribute.

Example

<amp-img amp-fx-parallax="0.5" height="50vh" layout="fixed-height" src="hero.jpg">
</amp-img>

Attributes

amp-fx-parallax

The factor to use when scrolling. A value greater than 1 scrolls the element upward when the user scrolls down the page. A value less than 1 scrolls the element downward when the user scrolls downward. A value of 1 behaves normally. A value of 0 effectively makes the element scroll fixed with the page.