Call to Action - Parallax Effect

Owned by Zachary Restifo
Last updated: Mar 23, 2021
2 min read

When you create a Banner component and go to insert it on to a page as a Call to Action in Tridion, you have several template options for displaying the Call to Action.

 

For more information on creating Banner components in Tridion, visit these instructions:

https://ysmweb.atlassian.net/wiki/spaces/HELP/pages/1847427363

 

This page provides an example of a Banner component displayed with the Call to Action - Parallax Effect template, as it appears on a page.

 

Example

The Parallax Effect is an animation that can be used to emphasize an image in a CTA Banner and the Banner itself.

  • As the user scrolls down the page and the banner moves into view, the background image will zoom in slightly.

  • The effect emphasizes the Banner, giving visual indication as the user scrolls that they should pay attention to it.

The difference between the normal banner and its zoomed-in (Parallax) state is shown below:

Normal

A normal Call to Action Banner.

 

Parallax Effect

A Call to Action - Parallax Effect Banner, with the image slightly zoomed in because the user has scrolled far enough for the banner to be completely visible on the page.