Crystal Theme Navigation

Community Forums Forums Design Tips and Tricks Crystal Theme Navigation

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  jodzeee 1 year, 5 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #40823

    ikegordon
    Participant
    Post count: 5

    Could someone help? I’m trying to figure out how to keep the parent menu item highlighted when a visitor is on a child page (even if the child page isn’t listed on the menu itself). How should I go about doing this? Please, see code below and thanks in advance!

    `/***** Navigation Menus ********************/

    #nav, #subnav {
    background: url(images/menu_bg.gif) repeat-x;
    width: 960px;
    color: #334366;
    margin: 0;
    overflow: hidden;
    clear: both;
    }

    #nav ul, #subnav ul, #header ul.menu {
    background: url(images/menu_bg.gif) repeat-x;
    float: left;
    margin: 0;
    padding: 0;
    border-left: 1px solid #E4E9ED;
    border-right: 1px solid #E4E9ED;
    }

    #nav li, #subnav li, #header ul.menu li {
    float: left;
    list-style: none;
    }

    #nav li a, #subnav li a, #header ul.menu li a {
    color: #334366;
    display: block;
    font-size: 12px;
    margin: 1px 0 0 0;
    padding: 11px 20px 10px 20px;
    text-decoration: none;
    text-shadow: #FFFFFF 1px 1px;
    position: relative;
    border-left: 1px solid #FFFFFF;
    border-right: 1px solid #B8C6D1;
    }

    #nav li a:hover, #nav li a:active, #nav .current_page_item a, #nav .current-cat a, #nav .current-menu-item, #subnav li a:hover, #subnav li a:active, #subnav .current_page_item a, #subnav .current-cat a, #subnav .current-menu-item, #header ul.menu li a:hover, #header ul.menu li a:active, #header ul.menu .current_page_item a, #header ul.menu .current-cat a, #header ul.menu .current-menu-item a {
    background: url(images/menu_highlight.gif) repeat-x;
    color: #334366;
    }

    #nav li a.sf-with-ul, #subnav li a.sf-with-ul, #header ul.menu li a.sf-with-ul {
    padding-right: 35px;
    }

    #nav li a .sf-sub-indicator, #subnav li a .sf-sub-indicator, #header ul.menu li a .sf-sub-indicator {
    background: url(images/arrow-down.gif);
    display: block;
    width: 7px;
    height: 5px;
    top: 19px;
    right: 14px;
    text-indent: -9999px;
    overflow: hidden;
    position: absolute;
    }

    #nav li li a, #nav li li a:link, #nav li li a:visited, #subnav li li a, #subnav li li a:link, #subnav li li a:visited, #header ul.menu li li a, #header ul.menu li li a:link, #header ul.menu li li a:visited {
    background: url(images/menu_bg.gif) repeat-x;
    color: #334366;
    width: 138px;
    margin: 0;
    padding: 12px 30px 10px 20px;
    position: relative;
    border-left: 1px solid #FFFFFF;
    border-right: 1px solid #B8C6D1;
    }

    #nav li li a:hover, #nav li li a:active, #subnav li li a:hover, #subnav li li a:active, #header ul.menu li li a:hover, #header ul.menu li li a:active {
    background: url(images/menu_highlight.gif) repeat-x;
    color: #334366;
    padding: 11px 30px 9px 20px;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #BCC9D2;
    }

    #nav li li a .sf-sub-indicator, #subnav li li a .sf-sub-indicator, #header ul.menu li li a .sf-sub-indicator {
    width: 5px;
    height: 7px;
    background: url(images/arrow-right.gif);
    top: 19px;
    }

    #nav li ul, #subnav li ul, #header ul.menu li ul {
    width: 190px;
    z-index: 9999;
    position: absolute;
    left: -999em;
    height: auto;
    margin: 0;
    padding: 0;
    }

    #nav li ul a, #subnav li ul a, #header ul.menu li ul a {
    width: 140px;
    }

    #nav li ul ul, #subnav li ul ul, #header ul.menu li ul ul {
    margin: -42px 0 0 190px;
    padding: 0;
    }

    #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfHover ul ul, #nav li.sfHover ul ul ul, #subnav li:hover ul ul, #subnav li:hover ul ul ul, #subnav li.sfHover ul ul, #subnav li.sfHover ul ul ul, #header ul.menu li:hover ul ul, #header ul.menu li:hover ul ul ul, #header ul.menu li.sfHover ul ul, #header ul.menu li.sfHover ul ul ul {
    left: -999em;
    }

    #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfHover ul, #nav li li.sfHover ul, #nav li li li.sfHover ul, #subnav li:hover ul, #subnav li li:hover ul, #subnav li li li:hover ul, #subnav li.sfHover ul, #subnav li li.sfHover ul, #subnav li li li.sfHover ul, #header ul.menu li:hover ul, #header ul.menu li li:hover ul, #header ul.menu li li li:hover ul, #header ul.menu li.sfHover ul, #header ul.menu li li.sfHover ul, #header ul.menu li li li.sfHover ul {
    left: auto;
    }

    #nav li:hover, #nav li.sfHover, #subnav li:hover, #subnav li.sfHover, #header ul.menu li:hover, #header ul.menu li.sfHover {
    position: static;
    }`


    Isaac J Gordon
    Isaac@three12design.com

    #42131

    jodzeee
    Participant
    Post count: 227

    See if this helps.

    `#nav .current-menu-ancestor > a {
    background:#353535;
    color:#A98C0C;
    }`

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.