Ultra-Light jQuery Fading Image Slideshow Plugin - DIY Slideshow

Diy Slideshow is an extremely simple jQuery plugin to create a responsive & full width image slideshow with a simple fade transition effect.

How to use it:

1. Include jQuery javascript library and the jQuery DIY Slideshow plugin's javascript and CSS in the Html page.

<link rel="stylesheet" href="css/style.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/slideshow.js"></script>

2. Create the Html for an image slideshow with controls.

<div id="Fader" class="fader"> 
<img class="slide" src="images/image_1.jpg"/> 
<img class="slide" src="images/image_2.jpg"/> 
<img class="slide" src="images/image_3.jpg"/>
<div class="fader_controls">
<div class="page prev" data-target="prev">&lsaquo;</div>
<div class="page next" data-target="next">&rsaquo;</div>
<ul class="pager_list">
</ul>
</div>
</div>

3. Call the plugin on the parent element and you're done.

$(function(){
$('#Fader').easyFader({
slideDur: 6000,
fadeDur: 800
});
});

---

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