Forum Moderators: open

Message Too Old, No Replies

jQuery sliding panels

         

geoffb

4:26 pm on Feb 27, 2014 (gmt 0)

10+ Year Member



I have 6 links that on hover over I want a panel to slide up with a specific height and width. Each link has its own colour so each panel needs to have the matching coloured background.

The problem I'm facing is the panels are separate to the links so although they slide up as I need, as soon as you move off the link they slide down. I need the panel to stay up when the user moves their mouse over it.

The only time a panel should come down is if the user moves their mouse off it, or if the user moves onto the next link the previous panel should slide back down whilst the new panel slides up.

Here is where I am at the moment with a jsfiddle [jsfiddle.net ]

Current jQuery, HTML/CSS can be seen at the fiddle

Any help really appreciated

Thanks

Fotiman

8:35 pm on Feb 27, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



You probably need to use some sort of setTimeout delay along with a reference to which panel is currently shown, and then you probably also need to add the same sort of hoverOut to the panels. Maybe something along these lines:
[jsfiddle.net...]