Ajouter un délais

Dans cette partie, nous verrons la méthode .delay() servant à ajouter un délais avant l'exécution d'un effet.

Méthode .delay()

API : http://api.jquery.com/delay/

$(selecteur).delay(Durée)

Prenons le cas de deux éléments #a et #b, qui reçoivent successivement une méthode .slideUp()puis .slideDown(). Nous ajoutons à l'élément #b une méthode .delay(1000) entre les deux méthodes de slide. Nous pouvons nous rendre compte qu'au clic sur le bouton, les effets de #a sont successifs, tandis que pour #b il y a une temporisation de 1s entre les deux.

$('#play').click(function(){

    // Pas de .delay()
    $('#a').slideUp().slideDown();

    // Avec .delay()
    $('#b').slideUp().delay(1000).slideDown();

});
`

See the Pen .delay by Sutterlity (@sutterlity) on CodePen.

Pour information la méthode .delay() ne s'applique qu'aux effets. Pour temporiser d'autres méthodes, il convient d'employer la fonction JavaScript setTimeout.