I'm sure this is simple but I can't figure it out for the life of me.
I have a containing div with 2 divs inside #uniwork & #personalwork all of which are the same size.
#uniwork & #personalwork are set at top:-360px so they are hidden and the containing div is set to overflow:hidden.
I also have 2 buttons #uni & #personal and when I click #uni the #uniwork div slides down to 0px; this is also the same for #personal & #personalwork div, they work fine.
However I am trying to achieve is when #uni is pressed and #uniwork slides down I want to be able to press #personal button to make the #uniwork div slide back up and allow the #personalwork div to slide down and vice versa. I don't want them to toggle each other just there own div and if the other div is visible slide that up.
I have tried the .slide and this isn't th effect I want, I want the actual div position to move.
I'm a graphic design student working on a summer project, and dabbling into some web design. I've created a mock up of an ebay sister site and I'm nearly finished but completely stuck in a rut with one thing that is so frustrating, I don't even know is possible.
I have a large Menu Navigation system which includes sub menus. My First button, (Categories) has a sub menu which consists of 'Fashion', 'Motors', 'Property' & 'Services' divs, which are set to hide as default but fade in once clicked.
The Problem I have is the 'Categories' Button has an opacity toggle on it, so when you click it the homepage div fades to 50% and the sub menu fades in. When you go through the Sub menu and for example click 'Motors' the homepage div fades out, and the motors div fades in.
When I click on the 'Categories' button again this fades the 'Motors' div out and fades the homepage div back in, but the Homepage is back at 100% because I have the opacity toggle on it. I need the homepage to stay at 50% whenever the Sub menu is fade in, can this be triggered by the sub menu div on fade in? or even the Motors div fade out?
I must also mentioned that my other Navigation buttons toggle the homepage opacity same as the Categories button.
What I am trying to achieve is on my navigation menu I have a button '#Cat' and when I click this I want it to change the opacity of a div (.homepage) to 50% but then when I click it again I want the opacity back to 100%
I have tried a few things but find that its dropping it to 50% but then bringing it back 100% straight away without clicking twice.
I'm an amateur at Jquery so this is a bit beyond me so thought I would ask the pros