View Full Version : Form Drop Down Menu, Interesting Idea Help

11-04-2008, 08:43 PM
I have your average basic drop down menu.

I have two questions:

1. Every drop down menu shows the first option on top and when clicked reveals the other options. Well, I don't like the old ugly box that is shown for a drop down menu. In the web program I am developing I need it to only display the text and not the box with the arrow. Does anyone know how this is possible?

I have already used a script that takes the opacity to 0 and doesn't show anything. The only problem is that I need it to show the text or something atleast for the people to see to click. In my case I just want the text and have that text able to pull down the drop down menu.

2. I actually want them to be able to mouseover the the specified text and have it bring up the drop down menu. So instead of click, I want mouseover.

I will GREATLY appreciate any help or direction with these 2 simple html form ideas.

Thank you!

11-04-2008, 11:59 PM
I don't know if CSS can change a select menu's appearance at all; if it can, that would be the best way to go.

Beyond that, you could simply replace the select menu with a single-item, horizontal JavaScript menu. But I don't mean you should change the actual HTML file; that would break accessibility. When the page loads, find the select and select.parentNode.replaceChild(list, select);.

11-05-2008, 03:44 AM
are you using a specific menu script? or is this just an idea? if you're using an existing script, let us know which one.

You don't need to change the opacity. The changes can be done, most of the time, in the CSS file. An easy way to go is just look through the CSS, find any background colors, and change them to "transparent". depending on the script, you may also need to remove any background images, but that can affect the functionality of some menus (such as arrow images for submenus). Just remember to keep an unaltered copy of the css as a reference, and do only one item at a time if you're having trouble keeping track of what you're changing.