Discussion :

[piffeo]

bonjour,

je suis en-dessous de débutant en javascript, merci de votre indulgence
j'utilise en fait jquery, que j'ai installé sur mon site
grâce à un tuto en ligne, j'ai créé une petite fonction pour faire une animation jquery qui permet, quand on clique sur 1 lien ayant la classe "effect" <a href="" class="effect">, d'afficher / cacher un bloc <div> en dessous ayant quant à lu la classe "hidden" (div class="hidden")

Code :

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

1
2
3
4
5
6
7
8
9
 
	$("a.effect").toggle(
		function() {
		$(".hidden").show('fast');
		},
		function() {
		$(".hidden").hide('slow');
		}
		);

La fonction en elle-même marche très bien, sauf que, voilà, j'ai 7 liens correspondant à 7 blocs différents que je veux animer sur ma page et plutôt que d'écrire 7 fois cette fonction avec des classes différentes, du type :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
	$("a.effect1").toggle(
		function() {
		$(".hidden1").show('fast');
		},
		function() {
		$(".hidden1").hide('slow');
		}
		);
 
	$("a.effect2").toggle(
		function() {
		$(".hidden2").show('fast');
		},
		function() {
		$(".hidden2").hide('slow');
		}
		);
 
etc.

j'ai pensé faire une boucle for de la manière suivante :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
	for (i=1; i<=6; i++) {
 
	$("a.effect"+i).toggle(
		function() {
		$(".hidden"+i).show('fast');
		},
		function() {
		$(".hidden"+i).hide('slow');
		}
		);
 
	}

Et bien cette boucle ne marche pas, alors que la boucle suivante fonctionne :

Code :

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

1
2
3
	for (i=1; i<=6; i++) {
		$(".hidden"+i).hide('slow');
	}

Pourquoi ? quelle est mon erreur ?

Merci d'avance.

[bigboomshakala]

FAQ

[DoubleU]

Essaie ca:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
	for (i=1; i<=6; i++) {
 
	$("a.effect"+i).toggle(
		function(_i) {
                   return function(){
		      $(".hidden"+_i).show('fast');
		   }
                }(i),
		function(_i) {
                   return function(){
		      $(".hidden"+_i).hide('slow');
                   }
		}(i)
		);
	}

[piffeo]

Merci, ça marche !