Minimalist Responsive Image Fader With jQuery - imgCrossfade

Just another responsive, cross-fading slideshow plugin that allows you to fade through a series of images at a certain interval.

How to use it:

1. Put jQuery library and the jQuery imgCrossfade plugin at the bottom of your webpage.

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="js/jquery.imgCrossfade.js"></script>

2. Add your images into a DIV element.

<div id="example">
  <img src="1.jpg" />
  <img src="2.jpg" />
  <img src="3.jpg" />
</div>

3. Make the slideshow responsive.

#example {

  /* the common width of the images */
  width: 600px; 

  /* for responsiveness */
  max-width: 100%; 
  
}

4. Call the function on the DIV element and done.

$("#example").imgCrossfade();

5. Override the default animation speed and interval time.

$("#example").imgCrossfade({
  fading: 'medium',
  interval: 7000
});

---

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