Dynamic Display of div tag onMouseOut hides it to quick

[url]http://www.michaelrparker.biz/index2.php[/url]

I am looking to make a dynamic menu, so that when user hovers over it, a new menu appears in a previously hidden div tag.

When you hover over “Dynamic Web Solutions” the div tag shows, but once you point your mouse on the showing div tag, its “onMouseOut” function gets called before you can hang out on the div tag long enough to look at its menu options.

Any ideas for making the div tag remain for a freindlier amount of time?

[code]

<td onMouseOver = showDiv(‘main1’) style=”width:13em;”>
<li style=”width:13em;” >Dynamic Web Solutions
</li></td>
<td style=”width:13em;”>
<div id=’main1′ class=’hiddenDiv’ style=”width:13em; height:10em; border:thin red solid;” onMouseOut=hideDiv(‘main1′) >
<ol><li><a href=’#’>1</a></li><li><a href=’#’>2</a></li>
</ol></div></td>
</tr>
</table>

[/code]

[code]
function showDiv(objID)
{
var s=document.getElementById(objID);
if(!s){return;}

s.className=’showDiv’;

}

function hideDiv(objID)
{

var h=document.getElementById(objID);
if(!h){return;}

h.className=’hiddenDiv’;

}
[/code]

Also in #JavaScript _↴