The Multilayer Parallax section adds a staggered parallax effect to your website by using multiple layers that scroll at different speeds. This creates a sense of depth and fluidity in your design.
How to Add a Multilayer Parallax Section
You can add this section from the Add Menu in the top menu bar.
Click the Add Menu icon (shortcut: M).
Search for and select "Multilayer Parallax."
Hover over the canvas and click where you want to add the section.
Styling a Multilayer Parallax Section
Once you've added the section, you can style it using the options in the right-side panel.
Clip content: Toggle this to hide any content that extends beyond the section's edges.
Resize to fill vertically: Click this to set the section's height to 100% of the viewport height.
Background: Add a solid color, a gradient, or a background image from your own library or from a free stock images library.
Aspect Ratio
You can specify and lock the aspect ratio of the section to maintain its proportions when it's resized. To select from popular aspect ratios, right-click the aspect lock icon.
Configuration Options
Double-click the section on the canvas to open its configuration menu.
Image should contain not cover: Toggle this to make the background image fit entirely within the section (the default is to fill the section).
Images: Click the pen icon to select or add images for each layer.
Effects 0% to 100%: Adjust this value to control the scroll effect for each layer. A value of 0% means the image scrolls at a regular speed, and 100% means it remains completely still.
Organizing Multilayer Parallax sections
Once a Multilayer Parallax section has been added it'll appear in the layers panel, you can drag it above or below other sections to place it where you need it in your project. Follow the steps below to learn how to do it.
Select the section in the layers panel
Click and hold it
Drag it above or below the section you want