The SitePoint Forums have moved.

You can now find them here.
This forum is now closed to new posts, but you can browse existing content.
You can find out more information about the move and how to open a new account (if necessary) here.
If you get stuck you can get support by emailing forums@sitepoint.com

If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

CSS Menu challenge

The cross-browser compatability issues aside (since this is still in very early stages) I am trying to achieve the following:

Say I navigate to the Philosophie > Expertise section. When not mouseovering the menu I would like a "sticky" effect. Essentially the ul ul li would be visible with the ul ul li:hover style applied to demonstrate that I am "HERE". The challenge comes when I want to browse to another part of the site, when using the menu I would like the "stickied" part to only show when either mouseovered that particular section or when the menu is inactive. In other words when browsing to the "Accueil", "Ressources" or other sections, the stickied "Philosophie" ul ul would disappear.

Is that question clear? If so, how would I achieve this? Is it possible with pure CSS (my guess is no)? If so\not how should I proceed to reach the desired effect?

Thanks for the reply and the welcome . I actually figured that part out. The challenge comes when I want to browse towards another section, and want my stickied li to hide while hovering over other sections (ie. "Accueil" and "Ressources"). Any thoughts?

ahh, css selectors can't move up the tree, so you can't make a change to an element effect the parent. But, a pure css solution would be to have the the 'selected' version of a z-index lower than the :hover, :focus states and each menu item taking up the full width of the menu.

It's difficult because your example requires a transparent background, but you could do it by covering up the 'stuck' menu with the background color of the hovered menu.
It wouldn't be neat though, I would consider a javascript solution.