executer des fonctions en boucle

[link.80]

Bonjour,

Je débutes en jquery et je me retrouve bloqué sur quelque chose d'assez simple mais malheureusmeent après plusieurs recherches sur le net je me permet de venir demander de l'aide ici.

j'ai ce code html :

Code :

1
2
3
4
5
6
7
8
 
<ul>
        <li class="choix1">texte 1</li>
        <li class="choix2">texte 2</li>
        <li class="choix3">texte 3</li>
        <li class="choix4">texte 4</li>
        <li class="choix5">texte 5</li>
</ul>

j'aimerais créer une animation toute simple en jquery, opacité à 0 et font-size 2px sur les <li> puis une par une, agrandir le texte de chaque <li> et mettre l'opacité à 1. Une fois la dernière fonctions exécutée (anim5), recommencer le tout (revenir à fonction start) pour recommencer l'anim et ainsi de suite...

j'ai essayé comme cela mais lors du deuxième tour ça bug complètement.

Code :

1
2
3
4
5
6
7
8
9
10
 
//lancement fonction start
start();
 
	function start(){$("ul li").animate({opacity:0,fontSize:"2px"},0,function(){anim1();});}
	function anim1(){$("li.choix1").animate({opacity:1,fontSize:"14px",},500,function(){anim2();});}
	function anim2(){$("li.choix2").animate({opacity:1,fontSize:"14px",},500,function(){anim3();});}
	function anim3(){$("li.choix3").animate({opacity:1,fontSize:"14px",},500,function(){anim4();});}
	function anim4(){$("li.choix4").animate({opacity:1,fontSize:"14px",},500,function(){anim5();});}
	function anim5(){$("li.choix5").animate({opacity:1,fontSize:"14px",},500,function(){start();});}

ça serait vraiment sympa si quelqu'un pouvais m'aider !!

d'avance un grand merci et salutations à tous ceux qui on lu mon post :-)