Hey all,
I'm working on a summer project for university, and I am 99% finished on it, there is just one small thing that I am stuck on;
I have a navigation system with a sub menu within one of the anchors, the sub menu has fadeIn on it when you click on the anchor, and so what I am after is;
When the sub menu is visible, I need the homepage opacity to drop to 25%, and when the sub menu is hidden I need the homepage opacity to come back to 100%
I thought this was possible through an If, else statement but as I am a novice I am unsure of this, and so far got this;
I have also tried this via .CSS which partially works, when the sub menu is visible the Homepage opacity drops but then when I click #cat and the sub menu is hidden, the homepage won't come back to 100% opacity ;
I'm working on a summer project for university, and I am 99% finished on it, there is just one small thing that I am stuck on;
I have a navigation system with a sub menu within one of the anchors, the sub menu has fadeIn on it when you click on the anchor, and so what I am after is;
When the sub menu is visible, I need the homepage opacity to drop to 25%, and when the sub menu is hidden I need the homepage opacity to come back to 100%
I thought this was possible through an If, else statement but as I am a novice I am unsure of this, and so far got this;
Code:
$("#cat").click(function(){
if ($('.sub1').is(':visible') ) {
$(".homepage").fadeTo(500, .25);}
else {
$(".homepage").fadeTo(500, 1);
}I have also tried this via .CSS which partially works, when the sub menu is visible the Homepage opacity drops but then when I click #cat and the sub menu is hidden, the homepage won't come back to 100% opacity ;
Code:
$("#cat").click(function(){
if ($('.sub1').css('opacity') == .25 ) {
$('.homepage').fadeTo(500, 1);
} else {
$('.homepage').fadeTo(500, .25);
}
});