Call to Action - Parallax Effect

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

 

For more information on creating Call to Action banners, visit these instructions:

Call to Action Banners

 

This page provides an example of a a 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.