textbox - Trying to understand a JQuery routine -

i had fantastic david on post how reset css before repeating sequence there wasn't enough room in comments ask questions. david set jquery right , rewrote of because heading in wrong direction have want, text appears on right, slides on left, pauses , fades. new line of text same thing , can have many lines want.

i understand happening here, i'm complete noob jquery. here jsfiddle of working - http://jsfiddle.net/bf49z/13/ - have rearranged lines make more sense me. here questions wouldn't fit in comments -

what hard understand why animation stopped, before it’s started.

$elements.eq(index).stop()   .animate({ 

i assume stops animation @ second, third, fourth etc repeats?

then

.animate({"opacity": "1",  //animate opacity opaque     "left": "6px"    //animate left 6px     }, 1000, 

makes visible , moves left, taking 1 second?

i understand

$(this).delay(3000) .animate({ //wait 3000ms

then next line way of fading changing opacity on 1 second?

       .animate({   "opacity": "0"  //animate opacity transparent     }, 1000,  

then next 2 lines reset css?

function(){ //after animation         $(this).css("left", "400px"); //reset left 

thanks again help, hope don’t mind questions. rob

the call .stop() stop animation in-progress element. since there shouldn't any, unnecessary in case. used when animations triggered mouse events. in such case, may need stop animation in-progress before starting new one.

the answers other questions "yes", .delay() applies animation queue, not have put in "complete" function.

therefore shorten code to:

(function animate(index) {     $elements.eq(index)         .animate({ opacity: '1', left: '6px' }, 1000)         .delay(3000)         .animate({ opacity: '0' }, 1000, function() {             $(this).css({ left: '400px' });             animate((index + 1) % $elements.length);         }); })(0); 

jsfiddle