Visualize the differences between two images with this extension. Simple to use, fully responsive and supports touch navigation, OT Before & After image slider is a must have with all Joomla websites.

OT Before & After image slider brings you a stunning way to highlight the differences between two images. Instead of placing the images side by side, your visitors now can compare 2 images in details via a swipable slider. You are offered the most visual way to focus on the difference between two images. It increases the engagement between your content and your users better than ever.

 

Quick Info

Version 1.0.0
Released date 2015-6-4
Responsive supported Yes
Available for Joomla! 3
 
1 1 1 1 1 1 1 1 1 1 (2 Votes)

Demos Free Download! Documentation Forum Support

 

 

Change log

+ V1.0.0 – April 6, 2015
  • Initial Release
+ V1.0.1 – March 7, 2016
  • Add image column width setting in shortcode

 

Work well with any device

Work well with any device

OT Before & after image slide is responsive and it will look good and display awesome no matter what device or screen size your visitors use. This way, users can have the best experience on your content.


Enhance mobile user experience through touch

We built this extension with mobility in mind. It supports touch navigation with pure swipe gesture that you have never experienced before.

Enhance mobile user experience through touch

Ease your work with intuitive panel settings

Ease your work with intuitive panel settings

Using OT before & after image slide is very easy with an intuitive admin panel. Just add 2 images and configure the slider quickly using clicks and you will get a stunning slider within a minute.

By adding shortcode to your article like this {twenty}image1=path_to_the_image1|image2=path_to_the_image2 |columnwidth=12{twenty} and path to images is depend folder that you selected from admin panel. Folder image is from root if it's not selected.

You can do adjustment the width for image, so it will display in number of column as bootstrap grid (1,2,3,4,5,6,7,8,9,10,11,12). Example,  columnwidth=12 then images are display in 100% of outer div width, columnwidth=6 then images are display in 50% of outer div width.


Support quickly from skillful experts

Looking for help and assistance? You can contact us any time through the support forums. We are happy to help you understand the best settings to use our products.

Support quickly from skillful experts width=