jQuery show for 5 seconds then hide

Question

J'utilise .show pour afficher un message caché après une soumission réussie du formulaire.

Comment afficher le message pendant 5 secondes puis le masquer ?

Answer 1

Vous pouvez utiliser .delay() avant une animation, comme ceci :

$("#myElem").show().delay(5000).fadeOut();

S'il ne s'agit pas d'une animation, utilisez setTimeout() directement, comme ceci :

$("#myElem").show();
setTimeout(function() { $("#myElem").hide(); }, 5000);

Vous faites le second parce que .hide() ne seraient normalement pas sur l'animation ( fx ) queue sans durée, c'est juste un effet instantané.

Ou, une autre option est d'utiliser .delay() et .queue() vous-même, comme ceci :

$("#myElem").show().delay(5000).queue(function(n) {
  $(this).hide(); n();
});

Answer 2

Vous pouvez utiliser l'effet ci-dessous pour animer, vous pouvez modifier les valeurs en fonction de vos besoins.

$("#myElem").fadeIn('slow').animate({opacity: 1.0}, 1500).effect("pulsate", { times: 2 }, 800).fadeOut('slow');

Answer 3

C'est aussi simple que ça :

$("#myElem").show("slow").delay(5000).hide("slow");