l'aide d'une fonction .delay() avant Css() la manipulation dans jQuery

Question

J'ai ceci:

var $ul = $(this).children("ul"); 
$ul.animate({opacity: 0}, 1000); 
$ul.delay(1000).css("display", "none") 

Il est pour mon menu déroulant, et je veux qu'il disparaissent progressivement avant qu'il ne disparaisse en utilisant la propriété display: none; CSS . Cependant, il semble que le .delay() ne peut pas être utilisé sur le .css(); cela ne fonctionne pas, le $ul disparaît tout de suite.

Je ne peux pas non plus utiliser $ul.animate({opacity: 0, display: "none"}, 1000);.

Answer 1

Le dernier paramètre à animate est un rappel qui est appelée lorsque l'animation est terminée, vous pouvez l'utiliser comme ceci:

$ul.animate({opacity: 0}, 1000, function() { 
    $(this).css("display", "none") 
}); 

Answer 2

Comme codeka dit le rappel est la bonne approche, mais il y a quelques méthodes de raccourci intégrées dans vous pouvez utiliser pour simplifier davantage, .fadeOut() et .hide(), comme ceci:

$ul.fadeOut(1000, function() { 
    $(this).hide(); 
});