Before After

With this widget you can create a wonderful before/after image transition of a photo. You can switch from the images simple dragging a slider line.

Content

Before After

  1. Before image: the image before the slider line
  2. After image: the image after the slider line
  3. Orientation: the orientation of slider line between vertical (default) and horizontal
  4. Default offset: the offset (in percent) of the slider line, default is in the middle

Settings

  1. Move slider on hover: if enabled the slider line follow your pointer without any click
  2. Move with handle only: if enabled allow to swipe anywhere on the image to control slider movement
  3. Click to move: if enabled allow to click or tap anywhere in the image to move the slider line

Overlay and labels

  1. No overlay: if enabled hide the overlay effect between before and after images
  2. Before: if No overlay is enabled, here you can customize the label of the before image
  3. After: if No overlay is enabled, here you can customize the label of the after image

Demo

Here a working example

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us