Bonjour à tous,

Je débute tout juste en jQuery, qui m'a été conseillé pour régler un pb de rollover, mais la je cale.

Voici mon script, qui fonctionne dans l'état mais auquel je souhaiterais ajouter des conditions. Et c'est là que je galère

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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
 
jQuery(document).ready(function(){
/****************menus*****************/
  jQuery("#menu_cuisine").show(function(){
    jQuery("#left").fadeTo("slow",1);
    jQuery("#right").fadeTo("slow",0.10);
    jQuery("#salon").hide();
    jQuery("#cuisine").fadeTo("slow",1);
  }
 
  );
  jQuery("#menu_salon").show(function(){
    jQuery("#left").fadeTo("slow",0.10);
    jQuery("#right").fadeTo("slow",1);
    jQuery("#salon").fadeTo("slow",1);
    jQuery("#cuisine").hide();
  });
 
 
/****************over*****************/
  jQuery("#left").mouseover(function(){
    jQuery(this).fadeTo("slow",1);
    jQuery("#right").fadeTo("slow",0.10);
    jQuery("#salon").hide();
    jQuery("#cuisine").fadeTo("slow",1);
  });
 
 
  jQuery("#right").mouseover(function(){
    jQuery("#left").fadeTo("slow",0.10);
    jQuery(this).fadeTo("slow",1);
    jQuery("#right2").hide();
    jQuery("#salon").fadeTo("slow",1);
    jQuery("#cuisine").hide();
  });
 
 
/****************out******************/
jQuery("#left").mouseout(function(){
    jQuery(this).fadeTo("slow",0.10);
      jQuery("#right").fadeTo("slow",1);
      jQuery("#salon").fadeTo("slow",1);
      jQuery("#cuisine").hide();
 
  });
 
jQuery("#right").mouseout(function(){
      jQuery(this).fadeTo("slow",0.10);
      jQuery("#left").fadeTo("slow",1);
      jQuery("#salon").hide();
      jQuery("#cuisine").fadeTo("slow",1);
 });
 
});
</script>
Je voudrais que :

Lorsque le menu cuisine est affiché :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
jQuery("#menu_cuisine").show(function(){
    jQuery("#left").fadeTo("slow",1);
    jQuery("#right").fadeTo("slow",0.10);
    jQuery("#salon").hide();
    jQuery("#cuisine").fadeTo("slow",1);
  }
Lorsque le menu cuisine est affiché et que mouseover sur right alors :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
jQuery("#right").mouseover(function(){
    jQuery("#left").fadeTo("slow",0.10);
    jQuery(this).fadeTo("slow",1);
    jQuery("#salon").fadeTo("slow",1);
    jQuery("#cuisine").hide();
  });
Lorsque le menu cuisine est affiché et que mouseout sur right alors :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
jQuery("#right").mouseout(function(){
      jQuery(this).fadeTo("slow",0.10);
      jQuery("#left").fadeTo("slow",1);
      jQuery("#salon").hide();
      jQuery("#cuisine").fadeTo("slow",1);
 });
Lorsque le menu cuisine est affiché et que mouseover et mouseout sur left alors :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
 
      jQuery(right).opacity 0.10 (mais là, je ne sais pas :oops:)
      jQuery("#left").show();
      jQuery("#salon").hide();
      jQuery("#cuisine").show();

Inversement pour le menu salon
Mais si déjà, vous pouvez m'éclairer pour le menu cuisine, je pense que je pourrais me débrouiller pour l'autre...

J'ai essayé en mettant des conditions if, else if et else mais à chaque fois, je perds mes effets

Par exemple :

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
 
jQuery(document).ready(function(){
/****************menus*****************/
  jQuery("#menu_cuisine").show(function(){
 
if jQuery("#left").mouseover(function(){
    jQuery(this).show();
    jQuery("#right").fadeTo("slow",0.10);
    jQuery("#salon").hide();
    jQuery("#cuisine").fadeTo("slow",1);
  })
 
else if jQuery("#right").mouseover(function(){
    jQuery("#left").fadeTo("slow",0.10);
    jQuery(this).show();
    jQuery("#salon").fadeTo("slow",1);
    jQuery("#cuisine").hide();
  })
 
else {
    jQuery("#left").fadeTo("slow",1);
    jQuery("#right").fadeTo("slow",0.10);
    jQuery("#salon").hide();
    jQuery("#cuisine").fadeTo("slow",1);
  }
 
  });
Merci pour votre aide et/ou conseils
@ +++