Jump to content

To Style the navigation levels ...


prichardson
 Share

Recommended Posts

Hello,I am trying to put these styles corrosponding to their levels. Therefore the rootlevel= navlevel0, and level1 (which is the child of rootlevel0) is navlevel1 , and so on with the other levels.

<style>a.navlevel0 { font-size:10px; font-weight:bold; font-family:Verdana, Arial, Helvetica, sans-serif; color:#006600;}a.navlevel1 { font-size:10px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#776666;}a.navlevel2 { font-size:9px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#996699;}a.navlevel3 { font-size:8px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#0066FF;}</style>

Here is asp code that i am trying to get the above styles to write out on the levels of the navigation system.

response.Write( PutSpace(level)&"<a href='?catID="& rsY("catID") &"' class=""navlevel0"">" & rsY("catName") & "</a><br>" )if instr( strExpands, "_" & rsY("catID") & "_") > 0 thentmp = ShowChilds( rsY("catID"), level+1, strExpands)end ifrsY.movenextwend

I think what would be great is a function that counts which level it is on and then apply the correct style that corrosponds to the level.Can anyone help me out with what code I would put to get that function to work, or any suggestions on going about it?Thanks

Link to comment
Share on other sites

If you built your navigation to use nested lists instead:

<ul>  <li>Category 1	<ul>		<li>Link 1</li>		<li>Link 2</li>	</ul>  </li>  <li>Category 2	<ul>	  <li>Link 1		<ul>		  <li>SubLink 1</li>		  <li>SubLink 2</li>		</ul>	  </li>	  <li>Link 2</li>	</ul>  </li></ul>

Then you can take care of all that styling in the CSS:

/* Main Level */ul { background-color: red; }/* Second Level */ul ul { background-color: green; }/* Third Level */ul ul ul { background-color: purple; }

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...