problem onmouseout event in div tag

greyone · Dec 18, 2000

i have a div tag which has a id and the style attributes for it are as below. Now i 'm running a for loop to write an array of elements on the page and putting each element in a table so that i can have hover effect on each one of them as seen below.
Now my problem is that onmouseout i want the layer to dissapear. i did this but as soon as i move over the elements the layer dissapears please help

<div id=dropmenu0 style="position:absolute;left:100;top:100;background-color:#CCCCCC;width:150;visibility:hidden;border:1px solid black ;padding:0px" onmouseover= some hide function>

<script language="JavaScript1.2">
if (document.all)
dropmenu0.style.padding="1px"
estr='<table border=0 width="150" bordercolor=black cellpadding="1" cellspacing="0">'
estr+='<tr><td align="left" class=menu onmouseover=this.style.background="#FF0000" onmouseout=this.style.background="#CCCCCC">'
for (i=0;i<menu1.length;i++)
document.write(estr + menu1+'</td></tr></table>')

</script>
</div>

jaredn · Dec 18, 2000

your code says onmouseover=some hide function - aren't you trying to hide onmouseout jared@aauser.com

greyone · Dec 18, 2000

well yes but the mouse out behaves very differently since when my mouse is on the layer, the layer seems to dissapear. i don;t want it to hide until my mouse is out of the layer but this dose'nt seem to happen. Please help

jaredn · Dec 18, 2000

this is not the best way of doing this, but if you need a quick and dirty fix, here ya go (tested on IE5.5):

<script>
var Global_currmouseover = document.body

function mouseIn()
{
Global_currmouseover=window.event.srcElement
}

function mouseOut()
{
setTimeout("test()",1000)
}

function test()
{
if(Global_currmouseover.className!="menu&quot

{
dropmenu0.style.visibility='hidden'
}
}

document.onmouseover = mouseIn
</script>

</head>

<body>

<div id=dropmenu0 class="menu" style="position:absolute;left:100;top:100;background-color:#CCCCCC;width:150;border:1px solid black ;padding:0px" onmouseout="mouseOut(this)">

<script>
menu1=["Turbo","Dogma","Jive"]
if (document.all){
//dropmenu0.style.padding="1px"
estr='<table border=0 width="150" bordercolor=black cellpadding="0" cellspacing="0">'
estr+='<tr><td align="left" class="menu" onmouseover="this.style.background=\'#FF0000\'" onmouseout="this.style.background=\'#CCCCCC\'">'
for (i=0;i<menu1.length;i++)
{document.write(estr + menu1+'</td></tr></table>');}
}
</script>
</body>

jared@aauser.com

greyone · Dec 18, 2000

thanks a lot pal it worked. that was really great..i tested it in IE4 and it worked but i still have to figure out a way to do this in Netscape.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

problem onmouseout event in div tag

greyone

Programmer

jaredn

Programmer

greyone

Programmer

jaredn

Programmer

greyone

Programmer

Similar threads

Part and Inventory Search

Sponsor