Pause auto-rotate on mouseover (jQuery)

Question

I'm using a content slider plugin that is nice but lacks one important feature: does not stop auto-rotating slides on mouseover.

Here's the relevant part from the script:

var dotimer = function (x){
    if((opts.auto) == true) {
        if(timer != null) 
            clearInterval(timer);

        timer = setInterval(function() {
                $(opts.next).click();
                }, 3000);
    }
}

dotimer();

Full script can be previewed here

I want the rotation to pause on mouseover and resume on mouseout.

Thanks in advance for your help!

Answer 1

You need to set and clear the timer in the hover event:

var stopTimer() = function () {
    if (!timer) return;
    clearInterval(timer);
    timer = false;
};
$(something).hover(
    function() { stopTimer(); },
    function() { doTimer();   }
);

Answer 2

Try:

$(opts.slides).hover(function() {
  clearInterval(timer);
},
function() {
  dotimer();
});

Answer 3

Found a solution here: http://www.dlocc.com/articles/jflow-slider-auto-slider-with-pause-functionality/

Thanks anyway.