jQuery Plugin To Fade In / Out Elements In Sequence - fadeDelay

fadeDelay is a dead simple jQuery plugin used to fade in or fade out a series of elements sequentially, with options for delay and callback.

Basic usage:

1. Download the jQuery fadeDelay plugin and then include the jquery.fadeDelay.min.js script after jQuery JavaScript library.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="dist/jquery.fadeDelay.min.js"></script>

2. Create a list of html elements you want to fade in / out.

<ul id="demo">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  ...
</ul>

3. Enable the fade in effect on the list.

$('#demo li').fadeDelay();

4. Available options to customize the fade in / out effect.

$('#demo li').fadeDelay({

  // Time between each item
  interval : 50,      

  // Are we fading in or out?
  fadeIn : true,      

  // How long each item takes to fade
  fadeTime : 350,     

  // Function to call after completed
  callback : null,    

  // Hide all elements then fade in
  // if false then only fade in those already hidden
  hideVisible: true,  

  // By default, use opacity and visiblity to hide. Else use display
  opaque: true       
   
});

---

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