// function to move to next slide
function nextSlide( fade ) {
  // find the active slide
  var $active = $('#slides .slide.active');

  // hide the active slide
  $active.fadeOut( fade ).removeClass( 'active' );

  // find the next slide
  var $next = $active.next();
  if ( $next.length == 0 )
    $next = $('#slides .slide:first');

  // show the next slide
  $next.fadeIn( fade ).addClass( 'active' );
}

$(function() {
  var wait  = 4000;
  var fade  = 2000;

  // hide all images initially
  $('#slides .slide').hide();

  // force first slide
  nextSlide( fade );

  // move to next slide regularly
  setInterval( "nextSlide(" + fade + ")", wait );
});
