/*
 * CREATED BY XO STUDIO
 *  
 *  EXAMPLE: 
 *  <div id="slider">
      <img alt="banner1" class="banner-1" src="./images/design/banner-01.jpg" />
      <img alt="banner2" class="banner-2" src="./images/design/banner-02.jpg" />
      <img alt="banner3" class="banner-3" src="./images/design/banner-03.jpg" />
    </div>
 * 
 * MUST SAVE CLASS AND ID NAME !!! Change only number. 
*/

function timedCount()
{
  var max = "0";
  $('#slider img').each(function() {
      max = parseInt(max) + parseInt("1");
  });
  
  var now = "1";
  $('#slider img').each(function(index) {
      var opacity = $(this).css("opacity");
      if(opacity == "1")
      {
        now = parseInt(index)+parseInt("1");
      }
  });
   
  var next = parseInt(now)+parseInt("1");
  if(now == max)
  {
    next = "1";
  }
  $('.banner-'+(now)).animate({
      opacity: 0
    }, 2000, function() {
      // Animation complete.
    });
  
  $('.banner-'+next).animate({
      opacity: 1
    }, 2000, function() {
      // Animation complete.
    });  
}

function setOpacity()
{
  $('#slider img').each(function(index) {
    if(index != "0")
    {
      $(this).css("opacity", "0");
    }
  });
}

$(document).ready(function(){
  setOpacity();
  self.setInterval("timedCount()", 15000);
}); 
  
