Minimal Image Comparison Slider Plugin For jQuery
File Size: | 3.12 KB |
---|---|
Views Total: | 2681 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A super tiny (~1kb) jQuery plugin for creating a comparison slider on your before/after images that react to where the users mouse is on the page.
How to use it:
1. Place the jQuery Before/After Web Slider's stylesheet before_after.css
in the header of the webpage.
<link rel="stylesheet" href="before_after.css">
2. Embed your own before/after images to the slider.
<div class="before_after_slider"> <div class="before"> <img src="before.jpg"> </div> <div class="after"> <img src="after.jpg"> </div> <div class="separator_line"> </div>
This awesome jQuery plugin is developed by joncottrell. For more Advanced Usages, please check the demo page or visit the official website.