View Full Version : Need help badly!

11-11-2004, 12:48 PM
Hi. I'm completely at a loss trying to build a javascript menu for a page that has a bunch of form elements.
Essentially the menu works but hides behind the form fields and I have no idea how to fix it. Below is the code - I put a form field in for testing purposes.

The javascript I have stolen from an existing file and may not be the most elegant but it looks like it should do - if somebody can help me I promise I will take a javascript class and never bother any of you again. Many thanks

<title>Horizontal Drop Down Menus</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="drop_down.js"></script>
<style >

ul li {
position: relative;

li ul {
position: absolute;
left: 149px;
top: 0;
display: none;

ul li a {
display: block;
text-decoration: none;
color: #666666;
font-family: verdana;
background: #fff;
padding: 5px;
border: 1px solid #666666;
border-bottom: 0;

.navOn {
font-weight: bold;

.navTask {
color : #336699;

.navArrow {
image : url(images/arrow_blue.gif);

.navTask {
color : #336699;

/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; }
* html ul li a { height: 1%; }
/* End */

ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
border-bottom: 1px solid #666666;

li:hover ul, li.over ul {
display: block; }


<script language="Javascript">

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
node.onmouseout=function() {
(" over", "");


<ul id="nav">
<li><a class="navTask" href="#">Client Information</a></li>
<li><a class="navTask" href="#">Client Identity</a></li>
<li><a class="navTask"href="#">Money Laundering</a></li>
<li><a href="#">Administration</a>
<li><a href="#">Fund Identity</a></li>
<li><a href="#">Fund Details</a></li>
<li><a href="#">Admin Details</a></li>
<li><a href="#">Additional Details</a></li>

<li><a href="#">Custody</a>
<li><a href="#">Relationship Management</a></li>
<li><a href="#">General Information</a></li>
<li><a href="#">Bank Details</a></li>
<li><a href="#">Company Information</a></li>
<li><a href="#">Currency Details</a>
<li><a href="#">Capital Currencies</a></li>
<li><a href="#">Futures Currencies</a></li>
<li><a href="#">Custodian Details</a>
<li><a href="#">Money Laundering</a>
<li><a href="#">Partfund</a>
<li><a href="#">Fees</a>
<li><a href="#">Fee Administration</a></li>
<li><a href="#">Multi-Tiered Fees</a></li>
<li><a href="#">Single-Tiered Fees</a></li>
<li><a href="#">Performance Fees</a></li>
<td valign="top"> <select name=""><option value="s">mdf</option></select></td>

11-11-2004, 02:55 PM
slect is a windows component in IE

Roy Sinclair
11-12-2004, 03:51 PM
See this thread http://www.codingforums.com/showthread.php?s=&threadid=28261
for the solution.