retarder les effets JQuery

Question

Je souhaite supprimer un élément et tous ses éléments enfants après un délai de quelques secondes. mais je n'ai pas trouvé le moyen de spécifier qu'un effet devrait commencer après un délai spécifié.

Answer 1

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

Le chiffre 5000 correspond à 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();

Remarque: vous n'avez pas besoin d'un rappel.

Modifier: vous devez maintenant utiliser le jQuery 1.4. méthode intégrée delay () . Je n'ai pas vérifié, mais je suppose que c'est plus "malin" que mon plugin.

Answer 3

Auparavant, vous feriez quelque chose comme ceci

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

La première animation ne fait rien car vous avez déjà l'opacité 1 sur l'élément, mais il y aurait une pause pendant un certain temps.

Dans jQuery 1.4, ils ont intégré cela dans le cadre afin que vous n'ayez pas à utiliser le hack comme ci-dessus.

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

La fonctionnalité est identique à celle du plugin jQuery.delay () d'origine http://www.evanbot.com/article/jquery-delay-plugin/4

Answer 4

Le meilleur moyen consiste à utiliser la méthode de délai jQuery:

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

Answer 5

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

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

Answer 6

J'ai écrit un plugin pour vous permettre d'ajouter un délai dans la chaîne.

Par exemple, $ ('# div'). fadeOut (). delay (5000) .fadeIn (); // fondre un élément, attendez 5 secondes, puis fondez un élément.

Il n’utilise pas de piratage d’animation ni de chaînage excessif de rappels, mais simplement du code court propre et propre.

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