Activer hierarchiquement les fonctions animate

**MrAl1985** · 31/05/2010, 23h07

Salut,
je sais le titre a l'air compliqué mais en fait mon problème est tout simple je pense:

J'ai 3 div associer a 3 événements.
ce que je veux c'est que l'utilisateur ne puisse pas cliquer sur le div 2 ni le div 3 tant que le 1 na pas était cliquer.
J' ai penser a .animate('disable') mais le problème est que la fonction n'est pas du tout exécutée.

voici mon code, j'espère avoir était clair dans mes explications

html:

Code :

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

1
2
3
4
5
 
<div id="right" class="block">Charge moi sur la remorque</div>
<div id="right1" class="block1">Charge moi sur la remorque</div>
<div id="right2" class="block2">Charge moi sur la remorque</div>
<img  class="animation_truck" src="empty_truck.png" alt="camion animation" />

js:

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
20
21
22
23
24
25
26
27
28
29
 
$("#right").click(function(){
$(".block").animate({ "top": "+=220px"}, {
			    		complete:function(){
						$(".block").stop().animate({"top": "+=0px"});
						  $("#power").animate( { width:"50px" }, 1500);
						}
					});
				});
 
$("#right1").click(function(){
$(".block1").animate({ "top": "+=220px"}, {	
			    		complete:function(){
						$(".block1").stop().animate({"top": "+=0px"});
						$("#power").animate( { width:"250px" }, 1500);
						return false;
						}
					});
				});
 
$("#right2").click(function(){
$(".block2").animate({ "top": "+=220px"}, {	
			    		complete:function(){
						$(".block2").stop().animate({"top": "+=0px"});
						$("#power").animate( { width:"450px" }, 1500);
						return false;
						}
					});
				});

**SpaceFrog** · 01/06/2010, 09h17

rajoute un flag boolean et teste le pour lancer ou non l'animation ?

**MrAl1985** · 01/06/2010, 15h21

Salut SpaceFrog et merci pour ta reponse.
seulement je ne vois pas concretement ce que tu veux entendre par boolean ?

tu me suggere d,utiliser la fonction : val() != "" ?

**SpaceFrog** · 01/06/2010, 16h22

je te suggère d'attribuer un flagboolean a l'objet lorsque tu l'as animé ...

**MrAl1985** · 01/06/2010, 19h17

peux tu me donner un exemple ?

**SpaceFrog** · 01/06/2010, 19h56

clicked étant le flag boolean ...

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
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<script type='text/javascript'>
$(document).ready( function(){
	$("#foo").click(function(){
	                           $(this).attr('clicked',true);
	                           $(this).css({'background-color':'red'})
	                           })
	$("#bar").click(function(){
	                           if (!$('#foo').attr('clicked')){alert("cliquez d'abord un")}
	                           else{
	                           	$(this).css({'background-color':'green'})
	                            $(this).attr('clicked',true);
 
	                           	}
	                           })
   $("#toc").click(function(){
	                           if (!$('#bar').attr('clicked')){alert("cliquez d'abord "+($('#foo').attr('clicked')?"deux":"un") )}
	                           else{
	                           	$(this).css({'background-color':'blue'})
	                            $(this).attr('clicked',true);
 
	                           	}
	                           })
 
 
});
</script>
<title>Nouvelle page 1</title>
</head>
<body>
<div id="foo">un
</div>
<div id='bar'>
deux
</div>
<div id='toc'>
trois
</div>
 
</body>
</html>

ici je pointe avec les selecteur des id directement, mais on peut imaginer le faire avec les next ou eq etc ...

Activer hierarchiquement les fonctions animate

jQuery

Vue hybride

Discussions similaires

Partager

Partager