Easy Image Compare Slider Plugin With jQuery and jQuery UI

SimpleSlider is a jQuery & jQuery UI plugin used for creating a vertical, draggable, touch-enabled slider to compare the before and after differences between 2 overlapping images.

How to use it:

1. Include the needed jQuery and jQuery UI libraries on the webpage.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/jquery-ui.min.js"></script>

2. Include the jQuery UI Touch Punch for touch event support.

<script src="/path/to/jquery.ui.touch-punch.min.js"></script>

3. Include the jQuery SimpleSlider plugin's JavaScript and CSS files on the page.

<link rel="stylesheet" href="simple-slider.css">
<script src="jquery.simple-slider.js"></script>

4. Insert the before / after images into a container.

<div id="comparison">
  <img src="before.jpg">
  <img src="after.jpg">
</div>

5. Call the function on the container and done.

$('#comparison').simpleSlider();

---

This awesome jQuery plugin is developed by icu222much. For more Advanced Usages, please check the demo page or visit the official website.