retarder les effets JQuery

Question

Je veux faire disparaître en fondu un élément et tous ses éléments enfants après un délai de quelques secondes. Mais je n'ai pas trouvé de moyen de spécifier qu'un effet doit commencer après un délai donné.

Answer 1

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

La valeur de 5000 est de cinq secondes en millisecondes.

Answer 2

J'utilise ce plugin de pause que je viens d'écrire

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

Appelez ça comme ça :

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

Note : vous n'avez pas besoin d'un callback.

---

Edit : Vous devriez maintenant utiliser le jQuery 1.4, avec delay() intégré méthode. Je n'ai pas vérifié mais je suppose qu'elle est plus "intelligente" que mon plugin.

Answer 3

Auparavant, vous deviez faire quelque chose comme ceci

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

La première animation ne fait rien puisque vous avez déjà l'opacité 1 sur l'élément, mais elle se mettrait en pause pendant le temps imparti.

Dans la version 1.4 de jQuery, cette fonction a été intégrée au cadre de travail, ce qui évite d'avoir à utiliser la méthode décrite ci-dessus.

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

La fonctionnalité est la même que celle de l'original jQuery.delay() plugin http://www.evanbot.com/article/jquery-delay-plugin/4

Answer 4

Le meilleur moyen est d'utiliser la méthode de retardement de jQuery :

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

Answer 5

Vous pouvez éviter d'utiliser setTimeout en utilisant la méthode fadeTo(), et en fixant un délai de 5 secondes.

$("#hideAfterFiveSeconds").click(function(){
  $(this).fadeTo(5000,1,function(){
    $(this).fadeOut("slow");
  });
});