Discussion :

[Halex78]

Bonjour,

je souhaiterais faire une petite animation qui se répète toutes les minutes (dans mon code j'ai réduit à 5 secondes pour le test).
Une fonction est executée toutes les minutes, fonction qui execute elle même une boucle au cours de laquelle chacun des menus du haut de la page subit un fadeIn fadeOut à250 ms d'intervalle grâce au setTimeout.
Ca ne fonctionne que pour le premier menu...

Le javascript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
var FadeInOutMenu = function(i){
	$(".menu_haut:eq("+i+")").find(".image_menu_on").fadeIn(500,function(){$(this).fadeOut();});
}
var AnimationMenus = function(){
	for(i=0;i<6;i++){
		window.setTimeout(FadeInOutMenu(i),250);
		continue;
	}
}
$(document).ready(function() {
				setInterval("AnimationMenus()",5000);
		    });

Le html : (il y en a 6)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<a href="./pagesite.php?nompage=intro_univers" class="menu_haut" id="univers"><img class="image_menu_on " src="css/images/barre_navigation/univers_on.png"/></a>

Voilà en fait le problème, c'est qu'un seul des menus en subit l'animation... J'aimerais que tous la subissent à 250 ms d'intervalle toutes les minutes

http://mereinetidor.free.fr/ : Pour visionner le problème : seul "site" subit l'animation toutes les 5 secondes.

[Bovino]

Salut,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.setTimeout(FadeInOutMenu(i),250);

Lorsque tu passes un nom de fonction en argument, tu ne peux pas lui passer de paramètre, il faut passer par une fonction anonyme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.setTimeout(function(){FadeInOutMenu(i)},250);

[Halex78]

Ok, mais ca marche pas mieux

[emmanuel.remy]

Salut,

Sauf erreur de ma part, quand tu écris ce code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
var AnimationMenus = function(){
	for(i=0;i<6;i++){
		window.setTimeout(function(){FadeInOutMenu(i)},250);
		continue;
	}

il y a création d'une closure et la variable i est stockée pour une exécution ultérieure. La variable i, pas sa valeur. Donc finalement ce code équivaut à celui-ci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
var AnimationMenus = function(){
	for(i=0;i<6;i++){
		window.setTimeout(function(){FadeInOutMenu(5)},250);
		continue;
	}

5 étant la dernière valeur prise par i.

Une solution est de passer par une fonction intermédiaire qui utilise i comme paramètre lors de son appel: c'est alors une copie de i qui est passée, et tout doit rentrer dans l'ordre.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
var AnimationMenus = function(){
   var effetMenu = function(numMenu) {
                     return function() {
                         FadeInOutMenu(numMenu);
                     };
    };
   for(var i=0;i<6;i++){
       window.setTimeout(effetMenu(i),250);
   }

ERE

[danielhagnoul]

Bonsoir.

Essayer :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
window.setTimeout("FadeInOutMenu(" + i + ")",250);

[Bovino]

Bien vu ERE...
Une autre solution :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var i=0;
window.setTimeout(function(){
    if(i < 5){
        i++;
        FadeInOutMenu(i)
    }
},250);