Question

I have a setInterval function that calls a for loop, looping through each HTML text item on my page. If there is a text update (checked with AJAX), the html text flashes with flashfunction().

$(document).ready(function() {
    setInterval("html_update(html_text)", 11000);   // influences flash time
});

This works fine for checking updates. But if there is an update, the animation triggers too fast (about 4x as fast as it does OUTSIDE the for loop)!

Here is the code to check an array of html text boxes to see if there is an update. If there is an update, the box will flash:

for (var i=0; i < id_array_len; i++) {
....some AJAX calls here...

if (httpRequest.ResponseText == 'update') {
$("#htmltext").css("background", color);
$("#htmltext").animate( { "opacity" : 0.4 }, 700, function() {
        $("#htmltext"+id).css("background", color);
        $("#meme"+id).animate( { "opacity" : 1 }, 300)
    });
}

Outside the for loop, the animation jQuery works at the correct speed. Inside the for loop, it flashes 4x as quickly…

Please help and thank you!!

Answer 1

I am a little confused by what ‘too fast’ means, but I suspect that you want to introduce a delay before triggering the animation. You can do that with jQuery’s delay method.

$('selector').delay(3000).animate({...});