$(document).ready(function() {
//Activate First Link
$(".imagenav a:first").addClass("active");
//width of a single image
var imgwidth = $(".imageholder").width();
//Total number of images
var totalimg = $(".imgslider img").size();
//Total width of all images
var allimgwidth = imgwidth * totalimg;
//Imgslider to new size which we got in above step
$(".imgslider").css({'width' : allimgwidth});
//Now right a new function for slide and slide navigation
rotate = function(){
//Number of times we need to slide
var slideid = $active.attr("rel") - 1;
//Set the distance which image needs to slide
var slidedistance = slideid * imgwidth;
//Remove active class
$(".imagenav a").removeClass('active');
//Add Active Class
$active.addClass('active');
//Slider Animation
$(".imgslider").animate({
        left: -slidedistance
    }, 1000 );
}; 
 
//Set Time for Rotation of slide
rotation = function(){
play = setInterval(function(){
//Next slide nav
$active = $('.imagenav a.active').next();
if ( $active.length === 0) {
//Move to first slide nav
$active = $('.imagenav a:first');
}
rotate();
//Timer speed 5 sec
}, 25000);
};
//Run rotation fuction
rotation();
$(".imagenav a").click(function() {
$active = $(this);
clearInterval(play);
rotate();
rotation();
return false;
});
});