Drop down menus in HTML

**sean** · 06-08-2002

You know those menus where you push on the little arrow and a menu drops down? I need to know the HTML tag and the basic attributes for that option. Also, how can I make it so that the browser submits the form to the CGI file when someone selects something from the list, without them having to push a button? I know it possible because Hotmail has an option where it can do that when you're selecting folders, but I've never seen the code for it.

**Commander** · 06-08-2002

I can give u a source for a pulldown menu!

Code:

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
var refer=true;
function combo() {
if (refer) {
  document.all.contents.style.visibility="visible";
  refer=false;
}
else {
  document.all.contents.style.visibility="hidden";
  refer=true;
}
}
</script>

</HEAD>



<BODY>

<table align="center">
<tr><td>
<table width="200" border="1" cellspacing="0" cellpadding="0" bordercolor="#d8d8d8">
  <tr>
    <td bgcolor="d8d8d8">
      <font face="verdana" size="2"> Choose a link</font>
    </td>
    <td align="right" width="21">
      <img src="img/combo_arrow.gif" name="combo_arrow" width="21" height="21" alt="" border="0" onclick="combo()" ></td>
  </tr>
</table>
<div id="contents" style="position:absolute; left:?px; top:?px; width:?px; height:?px; z-index:1; visibility:hidden">
  <table width="200" border="1" cellspacing="0" cellpadding="0" bordercolor="#d8d8d8">
  <tr>
    <td bgcolor="d8d8d8">
      <font face="verdana" size="2">
      <a href="#"> ENTER LINK HERE</a><br>
      <a href="#"> ENTER LINK HERE</a><br>
      <a href="#"> ENTER LINK HERE</a><br></font>
    </td>
  </tr>
</table>
</td></tr>
</table>
</body>
</html>

you could use this image, u don't need it though, u could put your own.

**Commander** · 06-08-2002

shoot, i forgot to attach the file, sorry

**~~frenchfry164~~** · 06-08-2002

I think there is a really easy way to do it in DHTML too.

**sean** · 06-08-2002

But I'm sure there is an html tag to do i. I'm not 100% sure but I think its <select>

**~~frenchfry164~~** · 06-08-2002

for DHTML just do a onMouseOver thing on the thing that the dropdown comes out of, then display the menu below. Do the matrix hyperlinking for each one of those options. It downloads faster, but also runs faster

**Dual-Catfish** · 06-08-2002

Taken from this pages source:

Code:

<option value="0">COLOR</option><!-- you should edit this list to remove the colors you don't want -->
<option value="skyblue" style="color:skyblue">sky blue</option>
<option value="royalblue" style="color:royalblue">royal blue</option>
<option value="blue" style="color:blue">blue</option>
<option value="darkblue" style="color:darkblue">dark-blue</option>
<option value="orange" style="color:orange">orange</option>
<option value="orangered" style="color:orangered">orange-red</option>
<option value="crimson" style="color:crimson">crimson</option>
<option value="red" style="color:red">red</option>
<option value="firebrick" style="color:firebrick">firebrick</option>
<option value="darkred" style="color:darkred">dark red</option>
<option value="green" style="color:green">green</option>
<option value="limegreen" style="color:limegreen">limegreen</option>
<option value="seagreen" style="color:seagreen">sea-green</option>
<option value="deeppink" style="color:deeppink">deeppink</option>
<option value="tomato" style="color:tomato">tomato</option>
<option value="coral" style="color:coral">coral</option>
<option value="purple" style="color:purple">purple</option>
<option value="indigo" style="color:indigo">indigo</option>
<option value="burlywood" style="color:burlywood">burlywood</option>
<option value="sandybrown" style="color:sandybrown">sandy brown</option>
<option value="sienna" style="color:sienna">sienna</option>
<option value="chocolate" style="color:chocolate">chocolate</option>
<option value="teal" style="color:teal">teal</option>
<option value="silver" style="color:silver">silver</option></select>

**MethodMan** · 06-08-2002

I know it can be easily done in javascript, as demonstrated above, if you want more than one drop down menu, go to www.nhl.com, and see the javascript for the different teams, and just 'take' the code, hehe.

**sean** · 06-09-2002

Dual-catfish is a genius.... phsyicic whatever - that's exactly what I was after. Thanks dude.

**Zeeshan** · 06-10-2002

I'm pretty sure, it can't be done in HTML alone.

**sean** · 06-11-2002

I thought I'd seen it before somewhere. I'll try what dual-catfish (nice title BTW!) gave me. Looks promising.

Drop down menus in HTML

LinkBack

Thread Tools

Display

Drop down menus in HTML

Similar Threads

Programming drop down menus

Please Help - C code creates dynamic HTML

Writing an HTML Preprocessor

Design + HTML

Drop-Down Nav menu error - HTML