0

I've been struggling with this for a while now and need some help. I'm trying to create a quite specific navigation setup for a client.

I have a top level navigation which is hard coded and not a problem. The second level of navigation should populate the left sidebar of the site, it should also show a third level of nestled/folding navigation within it. The fourth level of navigation is then shown separately in a column next to the left sidebar.

The illustration below should help explain:

enter image description here

The issues I'm having is no solution I've come across can do all of these things.

In an ideal world I'd love to have one dynamic template rather than having lots but any help would be great.

3
  • What is the behavior if a child is not yet selected, or would one always be?
    – mor7ifer
    Jan 20, 2012 at 15:58
  • if a child isn't selected then the grandchild wouldn't be expanded, it would just be a list of children. If that makes sense. Jan 20, 2012 at 16:26
  • Yup, perfect sense, gimmie a few minutes and I'll post a solution with example code :)
    – mor7ifer
    Jan 20, 2012 at 16:34

1 Answer 1

0

Took a decent amount of tinkering, but I came up with something workable based around absolute positioning, I did not apply any hover actions, those should be relatively easy for you to do (don't forget to z-index). Here's the CSS I would use:

#m {
    list-style: none;
}
#m > li {
    padding: 15px;
    float: left;
}
#m .sub-menu {
    display: none;
    position: absolute;
    top: 50px;
    left: 0;
    width: 300px;
}
#m .sub-menu .sub-menu {
    position: static;
}
#m .sub-menu .sub-menu .sub-menu {
    position: absolute;
    width: 200px;
    top: 0;
    left: 300px;
}
#m .current-menu-ancestor > .sub-menu {
    display: block;
}
#m .current-menu-parent > .sub-menu {
    display: block;
}

#m is your menu holder, you can set that to whatever, the rest is default from wordpress, so you can't change that around too much without going to a custom walker or something...but why would you do that? Anyways, if you need help with the hover actions or anything, let me know.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.