Quiero atenuar un elemento y todos sus elementos secundarios después de un retraso de unos segundos. pero no he encontrado una manera de especificar que un efecto debería comenzar después de un retraso de tiempo especificado.demora JQuery effects
setTimeout(function() { $('#foo').fadeOut(); }, 5000);
El 5000 es cinco segundos en milisegundos.
Tenga en cuenta que esto es mediante la función setTimeout incorporada de Javascript, nada jQuery específico. –
Esto solo responde parcialmente a su pregunta, creo. –
Si los niños están dentro del elemento #foo, también deberían desvanecerse ... – swilliams
Puede evitar usar setTimeout utilizando el método fadeTo() y establecer un retraso de 5 segundos en eso.
$("#hideAfterFiveSeconds").click(function(){
$(this).fadeTo(5000,1,function(){
$(this).fadeOut("slow");
});
});
haciendo este tipo de bloque es muy intensivo en la CPU en comparación con setTimeout. No veo la ventaja. - ¿Por qué es necesario evitar el temporizador nativo? – redsquare
Yo uso este plugin pausa que acabo de escribir
$.fn.pause = function(duration) {
$(this).animate({ dummy: 1 }, duration);
return this;
};
llamada así:
$("#mainImage").pause(5000).fadeOut();
Nota: no es necesario una devolución de llamada.
Editar: Ahora se debe utilizar el método jQuery 1.4. built in delay(). No lo he comprobado pero supongo que es más "más inteligente" que mi complemento.
¡Esto me ayuda mucho!Gracias :-) – Jesse
¡cuidado si jQuery alguna vez agrega una función de pausa() porque probablemente habrá una mejor que la mía! pero es bueno abstraer lo que haces como este –
¿alguien puede explicar POR QUÉ no necesito una devolución de llamada? No estoy seguro de por qué esto no regresa inmediatamente –
He escrito un complemento que te permite agregar un retraso en la cadena.
por ejemplo $ ('# div'). FadeOut(). Delay (5000) .fadeIn(); // desvanece el elemento, espera 5 segundos, vuelve a fundir el elemento.
No utiliza ningún truco de animación o encadenamiento de devolución de llamada excesivo, simplemente borre el código corto.
Anteriormente se haría algo como esto
$('#foo').animate({opacity: 1},1000).fadeOut('slow');
La primera animado no está haciendo nada, puesto que ya tiene la opacidad 1 en el elemento, pero sería una pausa por la cantidad de tiempo .
En jQuery 1.4, han incorporado esto en el marco para que no tenga que usar el hack como se indica arriba.
$('#foo').delay(1000).fadeOut('slow');
La funcionalidad es el mismo que el original jQuery.delay() complemento http://www.evanbot.com/article/jquery-delay-plugin/4
La mejor forma de hacerlo es mediante el uso del método de retardo de jQuery:.
$ ('# my_id') de retardo (2000). fadeOut (2000);
jQuery 1.4 y superior –
¿Puedes dar un ejemplo de cuando los elementos secundarios de un elemento no se desvanecen? – tvanfosson
Lo siento, mi error, actualizaré la publicación –