Cette fonction fonctionne exactement comme loop sauf qu'elle permet de coupler deux animations. La première se lance, lorsqu'elle est terminée, la seconde se lance, puis lorsqu'elle est terminée, la première se relance à nouveau et ainsi de suite.
Le code de cet exemple :
Exemple avec un départ différent :
round_trip() accepte jusqu'à 6 paramètres (tous optionnels) selon deux prototypes possibles :
Avec proprietes_aller, une liste de propriétés et leurs valeur pour l'animation aller ; proprietes_retour, la liste pour le retour ; duree_aller et duree_retour les durées des deux animations, si une seule durée est spécifiée, elle est alors la même pour les deux animations ; pas_aller et pas_retour des fonctions qui s'exécuter à chaque pas de l'animation aller et retour. Si une seule fonction fournie, elle est exécutée à chaque pas des deux animations.
Si 4 paramètres sont fournis (ni plus ni moins) à la fonction et que le 4ème paramètre est une fonction, c'est le second prototype qui est utilisé. La durée vaut alors pour l'aller et le retour et la fonction est exécutée à l'aller et au retour.
Notes :
1. Une chaîne vide dans les paramètres de propriétés permet de créer une animation bouclée avec un temps de pause, en effet, aucune propriétés n'est animée durant la durée spécifiée.
2. "normal" permet d'utiliser la valeur par défaut pour les animations (modifiable via $.options.duration.normal). Attention si vous passez 0 ou null en duree_aller, duree_retour est utilisée à la place, il faut donc utiliser "normal" pour obtenir la vitesse par défaut à l'une des animations et pas à l'autre.
3. Si vous ne spécifiez pas de fonction aller ou pas de fonction retour, l'autre fonction est utilisée pour les deux. Si vous souhaitez exécutez du code seulement à l'aller ou seulement au retour, utilisez les fonctions vides :
Dans cet exemple, il ne se passe rien à l'aller de l'animation, mais au retour, du code est exécuté (ici l'avancement de l'animation est écrit dans le bloc sous forme de pourcentage).
4. Toutes les syntaxes disponibles dans a/animate() pour les liste de propriétés et les durées sont disponibles dans round_trip().