Parallax Sections

The most common parallax application

To create a classic parallax page effect simply add sections with background pictures between your content section.
Then use ScrollScenes to animate the background image's position down.

The DOM is very straight forward and consists of consecutive containers.

Please Note: For brevity reasons this example uses fixed durations.
This means the parallax movement won't exactly fit anymore, if the user resizes the window.
To learn how to use dynamic durations, please check out the expert example Responsive Duration.

view source

Content 1

view source

Content 2

view source