jQuery maquillaje div desvanecen en repetidas ocasiones dentro y fuera

Question

hola tengo una serie de divs creados en un bucle de este modo:

var myDiv ='#bannerHolder' 
     var fib_str = '1, 2, 3, 5, 8, 13, 21, 1, 2, 3, 5, 8, 13, 21, 1, 2, 3, 5, 8, 13, 21, 1, 2, 3, 5, 8, 13' 
     var widths_str = '33px, 31px, 35px, 9px, 16px, 50px, 33px, 24px, 40px, 20px, 63px, 30px, 10px, 29px, 11px, 12px, 51px, 31px, 35px, 11px, 14px, 50px, 30px, 25px, 38px, 20px, 35px' 
     var pos_str = '0px, 44px, 105px, 144px, 153px, 203px, 236px, 269px, 280px, 354px, 374px, 437px, 447px, 457px, 506px, 517px, 529px, 604px, 646px, 687px, 698px, 712px, 762px, 787px, 823px, 895px, 915px' 
     var color_str = '#D5E1D7, #18D4C9,#BF51C3,#1E82C9, #EDEDED, #E1C981, #C9A94F, #BDBCAA, #5DB522, #EB2F34, #823133, #004BD8, #A6A0A0, #DS9F36, #FFDB00, #69944F, #18D4C9, #BF51C3, #1E82C9, #6B949A, #FFDB00, #819E64, #BDBCAA, #54BA43, #EB2F34, #823133' 
     var width = widths_str.split(","); 
     var pos = pos_str.split(","); 
     var color = color_str.split(","); 
     var fib = fib_str.split(","); 
     console.log(width); 
     console.log(pos); 
     console.log(color); 
     var counter = width.length 
     var stopper = false; 
for(i=0;i<counter;i++){ 
       var html = '<div id ="stripe'+i+'"/>' 
       $(myDiv).append(html) 
       $('#stripe'+i).css({ 'top': 0, 'left': pos[i],'position': 'absolute', 'float': 'left', 'background-color' : color[i]}) 
       $('#stripe'+i).attr({ 'min-width' : width[i], 'min-height' : '100px' }) 
       $('#stripe'+i).width(width[i]) 
       $('#stripe'+i).height('100px') 


      }; 

lo que quiero es que cada Div creado desvanecen completamente a continuación, hizo desvanecerse de nuevo y para que este proceso continúe repitiéndose para siempre. si trato de usar .animate() y llamo a una función para la propiedad Complete: property obtengo demasiadas recursiones y la página se rompe, ¿cómo puedo hacer esto

Answer 1

El problema es invocar recursivamente las rutinas fade *() desde el interior del otro, necesita configurar la secuencia como algo que se puede invocar repetidamente de forma no recursiva.

Este es un método bastante ordenada:

demo aquí: http://jsfiddle.net/ZZGhn/

$('.block').bind('fade-cycle', function() { 
    $(this).fadeOut('fast', function() { 
     $(this).fadeIn('fast', function() { 
      $(this).trigger('fade-cycle'); 
     }); 
    }); 
}); 

// This next block of code just sets all the triggers off at random times 
// The point is to start them using .trigger('fade-cycle'); 
// All can be started simultaneously with $('.block').trigger('fade-cycle'); 

$('.block').each(function(index, elem) { 
    setTimeout(function() { 
     $(elem).trigger('fade-cycle'); 
    }, index * 250); 
}); 

Answer 2

¿Has considerado el plugin Pulse? Demo here.

Answer 3

hiciste una búsqueda antes de publicar?

esta pregunta y respuesta debería al menos a usted en la dirección correcta: jQuery fadein fadeout repeatedly