[SOLUCIONADO] animate opacity no hace opacidad a 0 lo que hace es display none

[melkart239]

Saludos.
Estoy tratando de crear el típico efecto de las luces de los autos de choque o de las luces de árbol de navidad. Sí, esas que se encienden y apagan con una secuencia tipo flash.
Las luces son imágenes, de luces de colores evidentemente, puestas flotando en un div para en caso de cambio de tamaño de pantalla se ajusten y autodistribuyan.
Las tengo clasificadas por la etiqueta alt (rojas, allos, verdes, etc).
Entonces el código es:

Código:

var verdes = $('[alt=verde]');

Con ello ya tengo en un array todas las luces verdes.
Y ahora viene el parpadeo de las luces

Código:

for(i=0; i<4; i++){
	$(verdes.slice(0)).animate({'opacity': 'toggle'}, 500);
}

El problema es que mirando el inspector del navegador (Firefox) lo que hace el código no es opacidad = 0, sino display = none.
Con lo cual todas las luces se descolocan.
Alguna idea de cómo solucionar el problema.
Gracias de antemano.

[melkart239]

Aunque he encontrado la solución, ¿no os parece que este fenómeno es un bug? Para mí no tiene ninguna lógica. Pero claro, este humilde servidor....
La conclusión es que no puedes usar animate y opacidad juntos pues al suceder el display none se te descontrolan las posiciones de los elementos de la página.
La solución es usar fadeTo, fadeIn, fadeOut.
PD: Lo que supone, en mi caso, cambiar de táctica para crear el efecto luces autos de choque, Las Vegas, etc.