Simple news ticker - how to make autoscroll / auto action performe with jQuery?

I wrote small news ticker, see here: http://jsfiddle.net/MrTest/SvFRs/

I would like to add to it - auto scroll ( perform click on 'next' every couple of seconds). Also, how can I prevent script of doing it if user have interact with it within let say less than 5 se开发者_StackOverflow中文版c or currently on hover?

Unfortunately, I don't have a clue how I could start. Any clues?

Any help much appreciated.

Pete

Live Demo

Below is the code I changed. Basically all you do is assign a timeout to an interval id, and then clear it when you don't want it to change, and reset it when you do.

// Set a timeout
var timeOut = setTimeout(nextNotice, 3000);

// pause on hover
$('.noticeboard').hover(
    function(){clearTimeout(timeOut);},
    function(){timeOut = setTimeout(nextNotice, 3000);}
)
// Next notice function called on timeout or click
function nextNotice(event){
    clearTimeout(timeOut);
    timeOut = setTimeout(nextNotice, 3000);

    if ($('.noticeboard span:visible').is('.noticeboard span:last-child')) {
        $('.noticeboard span:visible').fadeOut();
        $('.noticeboard span:first-child').fadeIn();
    }
    else {
        $('.noticeboard span:visible').fadeOut().next().fadeIn();
    }

    if(event){
        event.preventDefault(); 
    }
}


$('#notice-next').click(nextNotice);

the best way would be to make your next and previous events into functions. Then you can use setInterval to call the next function. You'll need to keep a count so that when you get to the end you can show the first one again. You can stop the ticker using clearInterval.

Hope that helps point you in the correct direction.