Question

I’m having a slight issue with my jQuery code.
I’ve basically got a timer that loops through a set of images, which is on a setInterval

When I click on the right or left controller, it stops the interval and fades images based on user clicks rather than automatically.

$('a.right').click(function () {

    clearInterval(myInterval);
    setTimeout(function () { slideshow(); }, 9000);

    if (count < max - 1) {
        $('div.feature-image').eq(count).fadeOut('1000', function () {

            count++;
            $('div.feature-image').eq(count).fadeIn('1000');
            info++;
            $('div.img-info').html(info + ' of ' + max + ' | ');


        })

    }

I’ve used a setTimeout to wait 4seconds then continue the loop cycle.
Although I don’t think it’s the most elegant way to do it because the Jquery doesn’t know to stop the if statement. Is there a way I can on the setTimeout stop the if statement from carrying on it’s function?

Answer 1

Not sure I completely understood the problem, but what about something like this

setTimeout(function () {
  setTimeoutTriggered = true;
  slideshow();
}, 9000);

if ( (count < max - 1) && !setTimeoutTriggered ) {
  ...
}

Of course you can give setTimeoutTriggered a more semantic name.
And would be better to avoid global variables 🙂

Anyway, I find this jQuery plugin really good to manage timeouts and intervals!
http://plugins.jquery.com/project/timers