DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets Manager

Snippets has posted 5883 posts at DZone. View Full User Profile

Subvnavigation With Lists (1 Level)

06.07.2006

| 3149 views |

        The current Level (one up) is shown above the subnavigation (temp.titleT)

# SUBNAVIGATION

temp.titleT = HMENU
temp.titleT.wrap = <div id="cur_level">|</div>
temp.titleT.special = rootline
temp.titleT.special.range = 1|1
temp.titleT.1 = TMENU
temp.titleT.1 {
  NO.wrap = <span>|</span>
}

temp.subnav = HMENU
temp.subnav.entryLevel = 1
temp.subnav.1 = TMENU
temp.subnav.1 {

  wrap = <ul> | </ul>
  NO.wrapItemAndSub = <li>|</li>
  NO.stdWrap.htmlSpecialChars = 1
  NO.ATagParams = | |*||*|class="last"|
  ACT < NO
  ACT = 1
  ACT.wrapItemAndSub = <li class="act">|</li>
  ACT.stdWrap.htmlSpecialChars = 1

}

temp.subnav_area = COA
temp.subnav_area.10 < temp.titleT
temp.subnav_area.20 < temp.subnav

page.10 < temp.subnav_area


Style it with CSS

/* 1.Level */
#subnav UL { padding:0; margin:0; list-style:none; border-top:5px solid #bcc2be;}
#subnav UL LI A { display:block; text-decoration:none; background:#e4e7e5; padding:4px 2px 4px 7px; width:100%; border-bottom:1px solid #FFF;}
HTML>BODY #subnav UL LI A  { width:auto;}
#subnav UL LI A:hover { background:#f1f3f2 url('bg_nav_arr.gif') no-repeat 152px 8px;}
#subnav UL LI.act A { background:#f1f3f2 url('bg_nav_arr.gif') no-repeat 152px 8px;}
#subnav UL LI A.last { border:0;}

Tags: