Parallax effect gives the background content a different scrolling speed as the foreground moves. This effect can be implemented in your Zoomforth site through CSS classes. More information about using CSS classes can be found in this article.

The CSS class below can be used to give parallax effect to your target content:

.parallax { 

background-attachment: fixed;

}

There are two ways to add the custom CSS so the site can use it:

  1. via the site editor (check this article for more details)

  2. via the theme editor (check this article for more details)

Once the CSS class has been made available for use, you can then associate it to your target content via the site editor.

In the example below, the CSS class parallax is added in the site editor's custom CSS editor, and was applied to the background image of the hero section.

Did this answer your question?