efectos de retardo de jQuery


Quiero desvanecer 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 debe comenzar después de un retraso de tiempo especificado.

Author: Matthew Murdoch, 2008-10-30

6 answers

setTimeout(function() { $('#foo').fadeOut(); }, 5000);

Los 5000 son cinco segundos en milisegundos.

 77
Author: swilliams,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2008-10-30 18:26:03

Uso este plugin de pausa que acabo de escribir

$.fn.pause = function(duration) {
    $(this).animate({ dummy: 1 }, duration);
    return this;
};

Llámalo así:

$("#mainImage").pause(5000).fadeOut();

Nota: no necesita una devolución de llamada.


Editar: Ahora debería usar jQuery 1.4. construido en el método delay(). No he comprobado, pero supongo que es más 'inteligente' que mi plugin.

 43
Author: Simon_Weaver,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-01-19 11:06:15

Anteriormente harías algo como esto

$('#foo').animate({opacity: 1},1000).fadeOut('slow');

La primera animación no está haciendo nada, ya que ya tiene opacidad 1 en el elemento, pero se pausaría por la cantidad de tiempo.

En jQuery 1.4, han construido esto en el marco para que no tenga que usar el truco como el anterior.

$('#foo').delay(1000).fadeOut('slow');

La funcionalidad es la misma que la original jQuery.delay() plugin http://www.evanbot.com/article/jquery-delay-plugin/4

 19
Author: Drew,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-03-13 19:19:09

La mejor manera es usando el método delay de jQuery:

$('#my_id').delay(2000).fadeOut (2000);

 11
Author: ,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-04-15 18:02:26

Puede evitar usar setTimeout usando el método fadeTo (), y estableciendo un retraso de 5 segundos en eso.

$("#hideAfterFiveSeconds").click(function(){
  $(this).fadeTo(5000,1,function(){
    $(this).fadeOut("slow");
  });
});
 1
Author: Sampson,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-01-18 00:32:26

He escrito un plugin para que puedas añadir un retardo a la cadena.

Por ejemplo $('#div').fadeOut ().retraso (5000).fadeIn (); / / fade element out, wait 5 seconds, fade element back in.

No utiliza ningún hacks de animación o cadena de devolución de llamada excesiva, solo código corto simple y limpio.

Http://blindsignals.com/index.php/2009/07/jquery-delay /

 1
Author: ,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-07-09 05:21:03