Blinking tags with javascript, firing off at different times

I am blinking image tags in javascript using jquery.

Here's a simple sample of my code:

var timer = setInte开发者_Go百科rval( function(){
    $( leds ).css( 'opacity' ) == 1 ? 
              $( leds ).animate({ opacity: .1 }, 100 ) : 
              $( leds ).animate({ opacity:  1 }, 100 );
}, 500 );

But the the images blinking is not in sync, in fact, it is sequential in the order that the led array is stored. The difference is quite prominent. Also, over time, the the time it takes to blink appears to increase to upto 2 seconds instead of the original 0.5 seconds.

Any idea what is going on?

Probably your explicit setInterval isn't playing nice w/ jquery's animate. Have you considered looping the animation in some way?

http://www.irengba.com/codewell/