SitePoint.com

danielc1234 · Nov 7, 2009, 10:28

Hi all...it's been a while.
I am trying to incorporate a horizontal menu bar on a site. Hopefully I can explain what I am trying to do.

This is a example of the type of menu bar we are wanting to add, but with some added stuff.
http://www.polywood-furniture.com/testflyout.html

On this page in the horizontal nav bar section, I have both of the menu bars active. What I am trying to do is. Use the idea of the top nav with the blue tabs and have the drop down flyout menu like on the second top nav shown.
http://www.polywood-furniture.com/menu.html

My question is, would it be very hard to do this? These are really two horizontal menu bars and I am trying to incorporate things from both of them.
Any suggestions would be greatly appreciated.

Daniel

RyanReese · Nov 7, 2009, 21:45

Hi, the flyout looks the same in both examples, so do you just want the active page thing added on there? I've read it over multiple times and that's what I got out of it lol. Excuse me if I'm wrong.

rguy84 · Nov 7, 2009, 21:55

Have you looked at the YUI Menu? http://developer.yahoo.com/yui/menu/
Maybe that will save some work for you, and it is accessible too!

ralph.m · Nov 7, 2009, 23:21

danielc1234, I assume what you want is the same dropdown styles but the main horizontal links to behave like the top menu (with blue, rounded tabs appearing on hover?)

If so, you would essentially replace the CSS styles for the current top-level links with those of the tabs you want. No doubt there will be a bit of tweaking needed, but it shouldn't be hard.

semantic7 · Nov 8, 2009, 01:59

I don't think it is allowed to nest div's inside li. Just FYI incase you are looking to build a website that follows standards.

RyanReese · Nov 8, 2009, 09:52

Quote:

Originally Posted by semantic7

I don't think it is allowed to nest div's inside li. Just FYI incase you are looking to build a website that follows standards.

It's allowed.

Nov 7, 2009, 10:28	#1
danielc1234 SitePoint Addict Join Date: Oct 2006 Posts: 260	Top Menu Bar problems Hi all...it's been a while. I am trying to incorporate a horizontal menu bar on a site. Hopefully I can explain what I am trying to do. This is a example of the type of menu bar we are wanting to add, but with some added stuff. http://www.polywood-furniture.com/testflyout.html On this page in the horizontal nav bar section, I have both of the menu bars active. What I am trying to do is. Use the idea of the top nav with the blue tabs and have the drop down flyout menu like on the second top nav shown. http://www.polywood-furniture.com/menu.html My question is, would it be very hard to do this? These are really two horizontal menu bars and I am trying to incorporate things from both of them. Any suggestions would be greatly appreciated. Daniel

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

Nov 7, 2009, 21:45	#2
RyanReese CSS Guru in Training Join Date: Oct 2008 Location: Whiteford, MD Posts: 8,696	Hi, the flyout looks the same in both examples, so do you just want the active page thing added on there? I've read it over multiple times and that's what I got out of it lol. Excuse me if I'm wrong.

Nov 7, 2009, 21:55	#3
rguy84 SitePoint Addict Join Date: Sep 2005 Location: Seattle Area, WA Posts: 252	Have you looked at the YUI Menu? http://developer.yahoo.com/yui/menu/ Maybe that will save some work for you, and it is accessible too!

Nov 7, 2009, 23:21	#4
ralph.m Aiming for best practice Join Date: Mar 2009 Location: Melbourne, Australia Posts: 1,037	danielc1234, I assume what you want is the same dropdown styles but the main horizontal links to behave like the top menu (with blue, rounded tabs appearing on hover?) If so, you would essentially replace the CSS styles for the current top-level links with those of the tabs you want. No doubt there will be a bit of tweaking needed, but it shouldn't be hard.

Nov 8, 2009, 01:59	#5
semantic7 SitePoint Addict Join Date: Apr 2007 Posts: 241	I don't think it is allowed to nest div's inside li. Just FYI incase you are looking to build a website that follows standards.