Question

i’m pretty new to this jquery/javascript stuff but i have this jsfiddle example.
So far i have it starting on click but it needs to stop on click as well and return to original state (#pause_button1) which needs to toggle.
Any help would be appreciated
Thanks in advance
🙂

Answer 1

It is not 100% clear what you’re trying to do, but this could help:

var timer;
var imageNumber = 0;

$('#pause_button1').click(function() {
    startWorking(); 
});

$('#pause_button').click(function() {
    if (timer) {
        clearTimeout(timer);
        timer = false;
        $('#pause_button').removeClass('pause_button' + imageNumber);
        imageNumber = 0;
    }      
    else {
        startWorking();
    }
});

function startWorking() {
    function changeImage(element) {
        $('#pause_button').removeClass('pause_button' + imageNumber);
        imageNumber++;

        if (imageNumber > 6) {
            imageNumber = 1;
        }
        console.log(imageNumber);
        element.addClass('pause_button' + imageNumber, 200);        
        timer = setTimeout(function() {
            changeImage(element)
        }, 200);
    }

    changeImage($('#pause_button'));
}