CODEWITHSUNDEEP
jqueryloopsjquery-animate
jacek_podwysocki
jacek_podwysocki

Reputation: 807

Stop animation loop

How do I stop animation loop on click in jQuery? The following code generates blinking effect on the input field and works fine:

function blink() {
    $('#client_name').animate({"border-color": "#00DB00"}, 400);
    $('#client_name').animate({"border-color": "#ccc"}, 400);
}

setInterval(blink, 1000);

I tried stop() but it stops only currently running animation, not the whole loop:

$('#client_surname').click(function() {
    $('#client_name').stop();
});

Upvotes: 0

Views: 141

Answers (2)

Satpal
Satpal

Reputation: 133453

You should use clearInterval().

setInterval() returns intervalID, a unique interval ID you can pass to clearInterval()

var interval = setInterval(blink,1000);

$('#client_surname').click(function() {
    clearInterval(interval);
});

Upvotes: 1

Rakesh Kumar
Rakesh Kumar

Reputation: 2855

Try this.

var timer = setInterval(blink,1000);

$('#client_surname').click(function() {
    clearInterval(timer);
});

Upvotes: 1

Related Questions