Adding auto-rotation to a function
Hey guys - I'm having some trouble, so it's time I look to the community. I'm trying to add auto-rotation to a photo feature. It's pre-built, so I'm looking to just mod the code, rather than having to rebuilt the entire feature.
Here is the existing code:
[code]
function homeFeatureClick(event)
{
if (!$(this).parent().hasClass('selected'))
{
var selected = $('#feature .feature.selected');
var thumb = $(this);
var index = $('#feature_thumbs a').index(thumb);
var feature = $('.feature').eq(index);
selected.find('.feature_details').slideUp(500, function() {
// Hide current thumbnail
$('#feature_thumbs li.selected').animate({width: 81}, {duration: 500, easing: 'swing', complete: function () {
var color = $(this).children('a').attr('rel');
$(this).removeClass(color + '_selected selected').find('div').hide();
}});
// slide out clicked thumbnail
thumb.parent().find('div').show();
var color = thumb.attr('rel');
thumb.parent().addClass(color + '_selected selected').animate({width: 341}, {duration: 500, easing: 'swing'});
// fade out current photo
selected.removeClass('selected').fadeOut(500);
// fade in new photo
feature.addClass('selected').fadeIn(500, function () {
// slide up details when complete
feature.find('.feature_details').slideDown(500);
});
});
}
return false;
}
[\code]
Any thoughts? I just need it to rotate every few seconds, and if I'm really fancy, a pause on hover. Please let me know if you have any ideas.
Thanks so much!
--Sarah