Changer de contenu, animer son contenu

Question

Je développe une page de destination en utilisant un contentSwitcher, tout fonctionne bien, mais je me demande comment animer son contenu l'un après l'autre, juste pour ajouter un peu de style.

Vous pouvez voir qu'il y a un titre, un sous-titre, un paragraphe et des images ci-dessous, Comment puis-je ajouter fadeIn à chacun de ces éléments Séparés par quelques secondes les uns des autres?

Merci pour votre aide!

Answer 1

Vous pouvez utiliser les fonctions de rappel qui sera déclenché quand une animation est terminée

Jetez un oeil ici:

http://api.jquery.com/fadeIn/

Exemple:

$('#element1').fadeIn('slow', function() { 
     // this will be called then the first animation is complete 

     $('#element2').fadeIn('slow', function() { 
     // this will be called then the second animation is complete 

      $('#element3').fadeIn('slow', function() { 
      // this will be called then the third animation is complete 


      }); 


     }); 

}); 

Pour retarder les animations pour quelques secondes, utilisez .delay()

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