Menu Help!

Here To Learn · 06-01-2009, 05:32 AM

Hi everyone! I'm a newbie on the forum, so first I'd like to say hello to everyone!

I'm trying to build my newest web site based on a css template, but I can NOT for the life of me, figure out how to get the menu to work!

Someone please help! Here is what I have so far:

http://virtualvisions.110mb.com/Natural/about.html

It's a hot mess. I just want the links in the menu to appear to be regular text links, and then when the user clicks on one, I want the "tab" to move to that link and stay on it, then when they click on another link, to stay on that link, etc. I'm not sure, but I think this requires javascript??? No clue.

Here is the download link for the original template:
http://www.freecsstemplates.org/down...aturalbeauties

This is the stylesheet I'm using now: http://virtualvisions.110mb.com/Natural/default2.css

Anybody know how to do this??

Nick_mok · 06-02-2009, 01:46 AM

I looked at the source code of your website:

Take notice of this part:

<li><a href="#" accesskey="3" title="">Samples</a></li>
<li><a href="#" accesskey="4" title="">Pricing</a></li>
<li><a href="#" accesskey="5" title="">Contact</a></li>

Change the part I have highlighted in red, example:

<li><a href="sample.html" accesskey="3" title="">Samples</a></li>
<li><a href="pricing.html" accesskey="4" title="">Pricing</a></li>
<li><a href="contact.html" accesskey="5" title="">Contact</a></li>

or it can also be web addresses.

<li><a href="http://www.examplewebpage123.com" accesskey="3" title="">Samples</a></li>

constanthosting · 06-02-2009, 09:36 AM

You could always add a class for each page, so that the link for that page would be set as "active" or "current". You'd have to go through each page individually and change the menu for each page, individually..

I see you seem to be using an accesskey? is that like a ID , or a definer for the page that is currently active? then you would just have to set a body tag to co relate to the access key that you want highlighted and adjust your css to show the 'key/id' accordingly.

<body accesskey="3">

and css would have like

menu.accesskey1 =background image ==
menu.accesskey2 = backgroud image ===

-- of course, it is late, I'm headed to bed, zzz and I know my formatting for the css and etc isn't correct, but I hope this helps steers you in the right direction with it :-)

Here To Learn · 06-04-2009, 01:34 AM

Quote:

Originally Posted by constanthosting

You could always add a class for each page, so that the link for that page would be set as "active" or "current". You'd have to go through each page individually and change the menu for each page, individually..

I see you seem to be using an accesskey? is that like a ID , or a definer for the page that is currently active? then you would just have to set a body tag to co relate to the access key that you want highlighted and adjust your css to show the 'key/id' accordingly.

<body accesskey="3">

and css would have like

menu.accesskey1 =background image ==
menu.accesskey2 = backgroud image ===

-- of course, it is late, I'm headed to bed, zzz and I know my formatting for the css and etc isn't correct, but I hope this helps steers you in the right direction with it :-)

OMG I am so SLOW! Lol! I definitely just looked right over that. I thought it was gonna be something complicated that I had to do and it was actually the easiest thing ever. Thank you so much for your response constanthosting!!

06-01-2009, 05:32 AM	#1
Here To Learn New Member Join Date: May 2009 Posts: 2	Menu Help! Hi everyone! I'm a newbie on the forum, so first I'd like to say hello to everyone! I'm trying to build my newest web site based on a css template, but I can NOT for the life of me, figure out how to get the menu to work! Someone please help! Here is what I have so far: http://virtualvisions.110mb.com/Natural/about.html It's a hot mess. I just want the links in the menu to appear to be regular text links, and then when the user clicks on one, I want the "tab" to move to that link and stay on it, then when they click on another link, to stay on that link, etc. I'm not sure, but I think this requires javascript??? No clue. Here is the download link for the original template: http://www.freecsstemplates.org/down...aturalbeauties This is the stylesheet I'm using now: http://virtualvisions.110mb.com/Natural/default2.css Anybody know how to do this??

06-02-2009, 01:46 AM	#2
Nick_mok New Member Join Date: Jun 2009 Posts: 2	Hey I looked at the source code of your website: Take notice of this part: <li><a href="#" accesskey="3" title="">Samples</a></li> <li><a href="#" accesskey="4" title="">Pricing</a></li> <li><a href="#" accesskey="5" title="">Contact</a></li> Change the part I have highlighted in red, example: <li><a href="sample.html" accesskey="3" title="">Samples</a></li> <li><a href="pricing.html" accesskey="4" title="">Pricing</a></li> <li><a href="contact.html" accesskey="5" title="">Contact</a></li> or it can also be web addresses. <li><a href="http://www.examplewebpage123.com" accesskey="3" title="">Samples</a></li>

06-02-2009, 09:36 AM	#3
constanthosting Silver Member Join Date: Aug 2008 Location: Atlanta, Georgia Posts: 140	You could always add a class for each page, so that the link for that page would be set as "active" or "current". You'd have to go through each page individually and change the menu for each page, individually.. I see you seem to be using an accesskey? is that like a ID , or a definer for the page that is currently active? then you would just have to set a body tag to co relate to the access key that you want highlighted and adjust your css to show the 'key/id' accordingly. <body accesskey="3"> and css would have like menu.accesskey1 =background image == menu.accesskey2 = backgroud image === -- of course, it is late, I'm headed to bed, zzz and I know my formatting for the css and etc isn't correct, but I hope this helps steers you in the right direction with it :-) __________________ http://constant-hosting.com Webhosting Improved. You'll love our shared hosting.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode