Hello,
I’am new here and I begin with jQuery.
I’ll need your help for this code :
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").mouseenter(function(){
jQuery(this).fadeTo("slow",1);
jQuery("#right").fadeTo("slow",0.10);
jQuery("#salon").hide();
jQuery("#cuisine").fadeTo("slow",1);
});
jQuery("#right").mouseenter(function(){
jQuery("#left").fadeTo("slow",0.10);
jQuery(this).fadeTo("slow",1);
jQuery("#salon").fadeTo("slow",1);
jQuery("#cuisine").hide();
});
/****************out******************/
jQuery("#left").mouseleave(function(){
jQuery(this).fadeTo("slow",0.10);
jQuery("#right").fadeTo("slow",1);
jQuery("#salon").fadeTo("slow",1);
jQuery("#cuisine").hide();
});
jQuery("#right").mouseleave(function(){
jQuery(this).fadeTo("slow",0.10);
jQuery("#left").fadeTo("slow",1);
jQuery("#salon").hide();
jQuery("#cuisine").fadeTo("slow",1);
});
});
Like this, he works fine but, i’d like to place 2 conditions :
when menu_cuisine is show, juste one change => left must be like this for mouseenter and mouseleave
jQuery("#left").mouseenter(function(){
jQuery(this).show;
jQuery("#right").opacity (0.10);
jQuery("#salon").hide();
jQuery("#cuisine").show;
});
and
when menu_salon is show, juste one change => right must be like this for mouseenter and mouseleave
jQuery("#right").mouseenter(function(){
jQuery(this).show;
jQuery("#left").opacity (0.10);
jQuery("#salon").show;
jQuery("#cuisine").hide();
});
All the times I put conditions : if… else…, or if… else if… else…, all effects disappear and all images are visible.
I think it’s a pb with the syntax but I don’t know where
I’d test many codes and with .hover () too, but not working more.
for example :
jQuery("#left").hover(function(){
if("#menu_cuisine").show(function(){
$(this).show();
jQuery("#salon").hide();
jQuery("#cuisine").fadeTo("slow",1);},
function(){$(this).show();
jQuery("#salon").hide();
jQuery("#cuisine").show();
})
if ("#menu_salon").show(function() {
$(this).fadeTo("slow",1);
jQuery("#salon").hide();
jQuery("#cuisine").fadeTo("slow",1);},
function(){$(this).fadeTo("slow",0.10);
jQuery("#salon").fadeTo("slow",1);
jQuery("#cuisine").hide();})
});
jQuery("#right").hover(function(){
if("#menu_cuisine").show(function(){
$(this).fadeTo("slow",1);
jQuery ("#left").fadeTo("slow",0.10);
jQuery("#salon").fadeTo("slow",1);}
jQuery("#cuisine").hide();},
function(){$(this).show();
$(this).fadeTo("slow",0.10);
jQuery ("#left").fadeTo("slow",1);
jQuery("#salon").hide();
jQuery("#cuisine").fadeTo("slow",1);
})
if ("#menu_salon").show(function() {
$(this).show();
jQuery("#salon").fadeTo("slow",1);
jQuery("#cuisine").hide();},
function(){$(this).show();
jQuery("#salon").show();
jQuery("#cuisine").hide();})
});
Same results : all effects disappear and all images are visible
I don’t know how to solve this problem
Can you help me ?
Thanks
+++