En este consejo rápido de video, demostraré una manera fácil de permitir animaciones secuenciales de un número infinito de elementos. Originalmente aprendí esta técnica de Dave Methvin, pero no creo que muchas personas estén conscientes de este pequeño truco..
Queremos filtrar a través de un número infinito de elementos en una página, haciendo coincidir algún selector, y luego hacer que se desvanezcan secuencialmente.
Reloj
Yo
Desaparecer
var paras = $ ('p'), i = 0; // Si usa jQuery 1.4, no necesita hacer || []. (function () $ (paras [i ++] || []). fadeOut ('slow', argumentos.callee);) ();
Comenzamos por "almacenar en caché" todos los párrafos de la página, envueltos en el objeto jQuery (var paras). También creamos una variable iteradora. - yo. Este iterador nos permitirá apuntar a cada nuevo elemento de párrafo, sin conocer la longitud específica del paras objetar antes de tiempo.
Dentro de la función anónima de invocación automática, obtenemos el primer párrafo de la página con "paras [i]" ... Pero queremos incrementar yo por uno para cada iteración. De esta manera, la próxima vez que se llame a la selección, se hará referencia al siguiente elemento en el conjunto envuelto. Por lo tanto, debemos estar seguros de escribir paras [i ++]. Entonces, es una simple cuestión de llamar a fadeout y pasar argumentos. Se llama la función de devolución de llamada para permitir la recursión. Esto será igual a la función en la que está contenido; así que esencialmente estamos diciendo "enjuague y repita!"
alerta (argument.callee); // alerta sobre lo siguiente (function () $ (paras [i ++] || []). fadeOut ('slow', argumentos.callee);) ();
Si, por algún motivo, está utilizando jQuery 1.3 o una versión anterior, debe especificar qué debe ocurrir cuando paras [i] es igual a un elemento que no existe. En versiones anteriores de jQuery, devuelve un error, "indefinido". Para compensar, pasamos $ (paras [i ++] || []) para especificar que, si el elemento no existe, envolvemos una matriz vacía para evitar cualquier error.
Cabe señalar que, a partir de jQuery 1.4, esto no es necesario, ya que jQuery devolverá el objeto jQuery en su lugar.