...

View Full Version : Help with simple javascript drop down menu



DanPaul01
08-21-2008, 09:50 PM
Ok, first off I am clueless when it comes to javascript so be gentle. I got this from a tutorial and I am having a hard time getting the 2 columns to drop down for a menu.

I went to the site below

http://javascript-array.com/scripts/simple_drop_down_menu/

and copied and paste the menu and it works great. However some of our drop down menus are really long so i am trying to create a second column so I modified it like so.

html view


<ul id="sddm">
<li style="border-right:1px black solid; margin-left:1px;"><a href="#"
onmouseover="mopen('m1');mopen('m2')"
onmouseout="mclosetime()">Products</a>
<div id="m1"
onmouseover="mcancelclosetime()"
onmouseout="mclosetime()">
<a href="#">All Products</a>
<a href="#">more links</a>
<a href="#">more links</a>
</div>

<div id="m2" style="margin-left:100px;"
onmouseover="mcancelclosetime()"
onmouseout="mclosetime()">
<a href="#">All Products</a>
<a href="#">More links</a>
<a href="#">more links</a>
</div>
</li>
</ul>


and here is my javascript

javascript


<script type="text/javascript">

// Copyright 2006-2007 javascript-array.com

var timeout = 500;
var closetimer = 0;
var ddmenuitem = 0;

// open hidden layer
function mopen(id)
{
// cancel close timer
mcancelclosetime();

// close old layer

// get new layer and show it
ddmenuitem = document.getElementById(id);
ddmenuitem.style.visibility = 'visible';

}
// close showed layer
function mclose()
{
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
}

// go close timer
function mclosetime()
{
closetimer = window.setTimeout(mclose, timeout);
}

// cancel close timer
function mcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer = null;
}
}

// close layer when click-out
document.onclick = mclose;

</script>


the only thing I took out from the original javascript file is



// close old layer
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';


because if its there it doesnt display the second menu, however now it will display the second menu but they wont close....

any help would be greatly appreciated.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum