Horizontal drop down list

[Ranko]

I giving up on searching the web for it, so this is one of my last stops for help. Anyone know of a working CSS markup for a double horizonta l drop down menu? I am looking to build something like www.macromedia.com has for main navigation, except I want it in CSS, not Flash.

For the lazy clickers; I want to have a main horizontal list, that on hover shows another horizontal list. I have been working on it for a few days now, and need help, inspiration as I am stuck.

[spinal007]

<SELECT> controls aren't controlled by the browsers so you can't use onMouseover on the options within the <SELECT> tags. (that's also why <SELECT>'s are always on top of anything and we have to hide them if they're on the way of popup menus)

anyway, the solution for you would be to design (in HTML) something that LOOKS like a <SELECT> box, then use the onMouseover event.

the following code should get you started...

CSS:

Code: Select all

.SelectBox{ width:130px; border:#CECECE inset 2px; }
.SelectBox A, .SelectBox A:link, .SelectBox A:visited{
 background-color:white; color:black; width:100%; display:block; padding:2px;
}
.SelectBox A:hover{
 background-color:navy; color:white;
}

HTML:

Code: Select all

<DIV class=SelectBox>
 option 1
 option 2
 option 3
 option 4
</DIV>

[Ranko]

I am looking for something to show/hide the second row (the one that shows hover); I tryed using a variation of the drop down's fro www.alistapart.com , but no go.

[spinal007]

there you go:

http://www.pinesandneedles.com/webforumz/menu.htm

notes and explanation with code

[Ranko]

Before I forget, thanks a lot for taking the time to help me.

But I noticed several problems. First of all, we are not getting each other. I have the menu you kindly uploaded at home, all done with CSS lists, tweeked and working like a charm.

BTW and FYI, the version you uploaded dosen't work with Opera (7 I think) and Firfox (1, thus Mozilla 5.0).

What I want is:
Option 1 Option 2 Option 3
Option 1.1 Option 1.2 Option 1.3 etc.

[Ranko]

Quick note; 99% sure I have a "By George..." moment. Will test more and post if you (or anyone else) is interested. After quite a while I cought an idea, and noticed a few codes that might have been the problem.

[spinal007]

*sorry* if I didn't spend anymore time debugging it.
just wanted to give you the idea, os you could finish it off yourself.
seems to have worked so that's all that matters.

[Webforumz Staff]

I think the big problem is you're both taking about a different goal. When I first read double horizontal menu I imagined what spinal gave code for. After looking at the Macromedia site as mentioned as the example I saw that it was actually something different.

So, if you hadn't found it during your web seach go look at : http://www.aplus.co.yu/Dots/108/

If that doesn't help then I'll look around for some more.

[Webforumz Staff]

After looking at the Macromedia site I have to agree with Catalyst. His example URL appears to be exactly what you want, Ranko.
As a quick note, it's ridiculously easy to do in Flash, lol. Pretty ironic, really.