A scrollytelling image is a visual component to create a smooth, engaging flow as you scroll through the content. When multiple scrollytelling image sections are placed back-to-back, the background of one section fades into the next, while the content inside the sections moves with standard scrolling behavior. This technique adds a dynamic and immersive storytelling experience to your project.
With visually stunning effects and controlled content reveals, Scrollytelling image improves user experience by providing a seamless navigation experience through long-form content. It sets your website apart by showcasing innovation and creativity, making it more memorable to visitors.
Note: When you add a Scrollytelling image section for the first time, the editor will automatically create two sections. After you change the background image of the first section, you'll see the second section in the layers panel. To unleash their full potential, it's recommended to use two or more scrollytelling image sections in sequence.
How To Build An Interactive Website In Vev
Explore our tutorial Build with Vev: Interactive website for step-by-step instructions. Additionally, join our community to discover more about How To Build An Interactive Website In Vev.
Configuration options
The configuration options are detailed in the chart below:
Parameter | Description |
Background |
|
Icons |
|
Duration | Animation time in milliseconds (350 ms is recommended). |
Easing | Select which easing function you want to use for your animation. |
Zoom | Toggle to make your image come slightly to life as it zooms in and out slowly. |