Simple Javascript or jQuery clearInterval problem

user688079 picture user688079 · Apr 1, 2011 · Viewed 17.8k times · Source

I have gone through most of the code here and tried several ways to get clearInterval to work and for some reason it is just not working, although it is a basic and simple problem.

Here is the code and I want to know WHY it isn't working, not just get the code done for me.

var myTimer;

function startTimer() {
    myTimer = window.setInterval( function() {
        $('#randomImage').fadeTo('slow',0.0).addClass("changeBg_" + current);
        var current = Math.round(Math.random() * 4) + 1;
        $('#randomImage').fadeTo('slow',1.0).addClass("changeBg_" + current);
    }, 5000);
};

function stopTimer(){
    window.clearInterval(myTimer);
    $('#randomImage').fadeTo('slow',0.0);

}

Thanks In Advance from a Newbie...

Answer

Jakub Hampl picture Jakub Hampl · Apr 1, 2011

Your code is fine, it works perfectly. It must be a problem with the code calling it. Check out this fiddle.

var myTimer;

function startTimer() {
    myTimer = window.setInterval( function() {
        $('#randomImage').fadeTo('slow',0.0).addClass("changeBg_" + current);
        var current = Math.round(Math.random() * 4) + 1;
        $('#randomImage').fadeTo('slow',1.0).addClass("changeBg_" + current);
    }, 5000);
};

function stopTimer(){
    window.clearInterval(myTimer);
    $('#randomImage').fadeTo('slow',0.0);

}

startTimer();
$('#randomImage').click(function() { stopTimer(); });