CSS Horizontal Drop Down Menu [Help]

[Mat @ SWS]

I'm a designer, but one thing I've never done is create a menu that when you hover over an option, you get a "sub menu"

here's what i mean

i'm doing a site for a client - http://www.spirewebsolutions.co.uk/sgs/#

now lets say you hover above Downloads, you should get a submenu below

such as this:



how can i do this? what script do i need?

[ninoparisi]

i will try to help you ..just wait until next week , i will send you the script ...

[Mat @ SWS]

cheers bud

i've looked at stu nichols site (or what ever the name is) and a few other tutorials. but there doesnt seem to be anything that works for me lol

[Rumbaar]

It's a hard task to accomplish this so that it's supported how you want on all browsers.  IE7 and to some extend IE6 are a pain and don't render CSS correctly (consistently) or when they do they affect other sections of the site.  I know IE7 has driven me insane trying to get a pure CSS style menu system working.  I eventually had to put IE7 conditional code and use an alternate menu system.

Also the <!DOCTYPE used for the page is very important as well.

Best of luck, tho.

[Mat @ SWS]

cheers bud

my client has got a "menu generator program" that creates what you want in JavaScript. He sent me the coding etc, but it doesnt tie in well

The only other thing he mentioned was creating a flash menu. But I want it to tie in with the "original" site (www.spirewebsolutions.co.uk)

his site is/will be www.spiregamingsolutions.co.uk for now there's a preview here www.spirewebsolutions.co.uk/sgs

as you can see, then menu is html/css
having a horizontal drop down menu you still have his site looking like mine

[Rumbaar]

Funny I was looking for the site, that actually mentioned anyways

Have you tried:
A cross-browser drop-line cascading validating menu?
A drop-line cascading menu v2?
Sliding doors with a drop line three?

Use the correct DocType Definition (DTD)

Please , please, please note that for most of my demonstrations to work, especially in Internet Explorer, you MUST use a standards compliant !DOCTYPE, and for Internet Explorer this MUST be the first line of your (x)html.
Using <?xml version="1.0" encoding="UTF-8"?> will switch IE into quirks mode.

I know I used it in the past, but he used to have a menu builder on his site.  But I can't seem to find it.

[Mat @ SWS]

Thing is with the Stu Nicholls menu, where do you get the source code from? The menus look great

I was looking at this one
http://www.cssplay.co.uk/menus/simple_dropline.html

tried looking at the source code on the page. but obviously that aint enough. where can i get the source for the menu?

[Rumbaar]

Actually all you get and need is in the page source.  Some have downloadable 'full' code, but for the most part you need to take 'em from the page source.

[Mat @ SWS]

kk cheers bud

[Mat @ SWS]

this is the closest i've got so far

http://www.spirewebsolutions.co.uk/sgs/testingmenu.html

[Mat @ SWS]

can people test this please

http://www.spirewebsolutions.co.uk/sgs/testingmenu.html

let me know if the menu works ok. personally i want to leave it as this

http://www.spirewebsolutions.co.uk/sgs

but the guy i'm doin the site for wants a drop down menu of some sort

[Rumbaar]

The demo works on FF, tho I would make it transparent or a lighter color.  Doesn't seem to function on IE6 though.

Also the widths seem a bit off.  The menus that drop horizontally would look better on that site.


PS: You spelt 'review' incorrect on the demo version

[Mat @ SWS]

i wonder who was gonna be 1st to notice that lol

[Rumbaar]

I doubt I was the first

Oh, I hate IE ... if it wasn't for them, designing a site would be so much easier!