The Before After Image Slider allows you to visualize the difference between two images.
Macro parameters
| Label | Parameter | Default | Description | Hosting Type |
|---|---|---|---|---|
| Method | method | Choose from 5 different methods to visualize the images. | Server, Cloud | |
| Left Image | leftImage | Search box for the left image. | Server, Cloud | |
| Right Image | rightImage | Search box for the right image. | Server, Cloud | |
| Width | width | 50% | Width of the container. | Server |
| Slide on mouse move | hover | Yes | If enabled slides will be moved with the mouse move. | Server, Cloud |
| Overlayed Slider | overlayedSlider | No | By default the slider is beneath the images. Settings this option the slider is on top of the images. | Server, Cloud |
| CSS Classes | cssClasses | Parameter to set additional css classes to enable further features or for advanced customization. | Server |
Methods
Overlay
From Right
Side by Side
Fade In
From Left
Other Configurations
Overlaid handle
Rounded Slider
Hidden handle (Mouse only)
Subtle slider