Touch-friendly Image Comparison Slider With JavaScript

Category: Javascript | November 8, 2017
Author: Paul-Browne
Views Total: 2,272
Official Page: Go to website
Last Update: November 8, 2017
License: MIT


Touch-friendly Image Comparison Slider With JavaScript


A simple, responsive, mobile-friendly JavaScript image comparison plugin to compare before/after images with an image comparison slider that reacts to mouse drag and touch swipe.

How to use it:

Insert the image-comparison-slider.css and image-comparison-slider.js into the html document.

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

Create the html for the image comparison container and insert your own images as follows:

<div class="image-spliter">
  <div class="mover"></div>
  <img class="img-left" src="">
  <img class="img-right" src="">

You Might Be Interested In:

Leave a Reply