HTML Before-After Viewer | jQuery plugin

HTML Before-After Viewer | jQuery plugin

For the WordPress plugin version you must look at this file

Main Features

  • Gallery that can show one or a list of before/after items
  • Lightbox feature that can let users open and see images full-window
  • Fixed or Responsive size
  • Gallery can be use in 3 different ways: – Simple page block – Simple page block with lightbox button – Lightbox only, that can be opened by a button
  • Option to add a link on item captions
  • Ability to use simple images, without the before&after tool


BIG UPDATE: 11 May 2013 – Version 2.0
New additions: – lightbox feature
– tweaks to improve compatibility with uses in tabs
– support for links on captions
– a code generator tool, to help easy generate viewer code.

Version 1.5 – 26-dec-2012. – tweaks for touch interface: draggable slider on touch – removed the jQuery-Draggable plugin and replaced with a custom script to prevent compatibility issues – updated included version of jQuery to version 1.8

Before After Viewer

Javascript jQuery plugin
- It can handle one before-after project or a list.
- Every project can have a title/small info, that will displayed under the viewer.
- Designed to work in all major browsers and even on touch devices.
- Can be used even as simple image viewer, if you don't provide the alternate image for the projects.

You can post ideas for improvements in the comments area. Thanks.

Check This:

If you are interested in a template that integrates seamless the before-after function you can check this WordPress Theme First Impression – Personal website :


More items by wickedpixel

Before-After Viewer - WordPress Plugin MINI 360 Degrees Viewer HTML Before-After Viewer | jQuery plugin