$(document).ready(function() {
  $(".paging").css("display","inline-block");
  var imageWidth = $(".slider").width();
  var imageSum = $(".reel a").size();
  for (x=0;x<imageSum;x++){
    $(".paging").append('<a href="#" rel="'+(x+1)+'" reel></a>');
  }
  $(".paging a[rel]:first").addClass("active");
  var imageReelWidth = imageWidth * imageSum;
  $(".reel").css({'width' : imageReelWidth});
  rotate = function(){  
	  var triggerID = $active.attr("rel") - 1;
    var image_reelPosition = triggerID * imageWidth;
    $(".paging a[rel]").removeClass('active');
    $active.addClass('active');
    $(".reel").animate({left: -image_reelPosition},500);
  };
  rotateSwitch = function(){    
    play = setInterval(function(){
      $active = $('.paging a[rel].active').next();
      if ( $active.length === 0) {$active = $('.paging a[rel]:first');}
      rotate();
    },6700);
  };
  rotateSwitch();
  $(".paging a[rel]").click(function() {  
    $active = $(this);
    clearInterval(play);
    rotate();
    rotateSwitch();
    return false;
  });
});