Question

Basically, what I have is a setInterval inside a function. What I want to do is, control it’s behavior from outside.

Here’s what I have –

function wheee() {
var i = 1;

slideee = setInterval(function() {
sliderContent.style.marginLeft = margin(i);
    if(i < imagesNoOneLess) {
        i++;
    } else {
        i = 0;
    }
}, 5000); }

Now, I want to clear the interval from outside the wheee() function. How can I do that?

I also want to run the interval again, from outside. How?

Answer 1

Global variables are not dangerous, but a pretty way of coding it if you only have one slider is to use an object literal to simulate a singleton object.

var Slider= {
    slider: null,
    Start: function(i) {
        this.slider = setInterval(function() {
            // Slider code
            console.log('running: ' + i);
            i++;
        }, 1000);
    },
    Stop: function() {
        window.clearTimeout(this.slider);
    }
};

Slider.Start(1); // Start the slider
Slider.Stop(); // Stop the slider