$(document).ready(function () { $(".Pag").show(); $(".Pag a:first").addClass("active"); var imageWidth = $(".window").width(); var imageSum = $(".image_reel img").size(); var imageReelWidth = imageWidth * imageSum; $(".image_reel").css({ 'width': imageReelWidth }); rotate = function () { var triggerID = $active.attr("rel") - 1; var image_reelPosition = triggerID * imageWidth; $(".Pag a").removeClass('active'); $active.addClass('active'); $(".image_reel").animate({ left: -image_reelPosition }, 1000); }; rotateSwitch = function () { play = setInterval(function () { $active = $('.Pag a.active').next(); if ($active.length === 0) { $active = $('.Pag a:first'); } rotate(); }, 7000); }; rotateSwitch(); $(".image_reel a").hover(function () { clearInterval(play); }, function () { rotateSwitch(); }); $(".Pag a").click(function () { $active = $(this); clearInterval(play); rotate(); rotateSwitch(); return false; }); });