In this section you will see a Parallax scrolling background with text and spacer assets to increase the size of the background image.

Scroll down for a break down of how this is built.

This guide is aimed at users already familiar with the Webselect CMS. If you are a new user please contact us for help.

Below you will find an explanation of how to build a section with a parallax scrolling background.

Parallax is a scrolling effect in which the background of the website moves at a different speed to the rest of the page for an impressive visual effect that allows for countless creative applications.

Section Assets

This section uses the text asset with various styles applied using the editor. The section also includes 2 spacer assets to create a larger area for the background image to be visible.

General Section Settings

To get this section to sit at the top of the page with no margin we have selected the 'no margin' checkbox in the general settings.


Outer Container Section Settings

The outer container has a background image added using the image selector. You can add any image that has been uploaded via the asset manager.

We have selected to set the background image position as the default value of X 50 Y 50. This means the background position will be centralised. There are further presets to move the image or you can choose to position it manually using the axis numbers.

The background scroll effect has been set to Parallax here.

This section doesn't use any inner container settings. The next sections will use these so will be explained once we come to these sections.