Block Before and After Slider
Before & After slider block lets you compare two versions of an image together. Before and after images will appear with a divider which can be moved so that users can see the difference.
|Upload the Before image
|Image 1 Label
|Enter the label of the Before image
|Upload the After image
|Image 2 Label
|Enter the label of the After image
|Image Width (px)
|Set the width of Before & After images
|Image Height (px)
|Set the height of Before & After images
|Cut out a part of the image: Top, Left, Bottom, Right, Center
|Set the sliding direction, either horizontal or vertical
|Set the divider to move on mouse hover or dragging
|Adjust the start position of the divider in percentages
|Set the divider bar's width (in px)
|Set the color of the divider bar
|Set the color of the navigation arrow
|Set the opacity of the navigation arrow
|Animate On Scroll
|Apply different types of animation to elements within each section as you scroll down the page. Learn more about scrolling animations here.
|Set the vertical spacing between elements.
Add other content blocks
You can add many content blocks to a section you've created. These content blocks will be displayed in different positions within the section, depending on the Desktop/Mobile Layouts you configure.