<div> help

[lmf232s]

i want to click on a button,
show a div that has a table in it with
rowsm when the button is clicked.
then hide the <div> when the <div> loses focus.

I have this

<script language=javascript>
function hide(){

oSpan.style.display='none'
}
</script>
<div id="oSpan" style="display:none;" onmouseout="hide();" cellpadding=0 cellspacing=0 bgcolor=black>
<table bgcolor=beige width=100% cellpadding=0 cellspacing=0 border=1>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<%For i = 1 to 4
if i mod 2 then
sCOlor = "green"
else
sColor = "Blue"
End if%>
<tr bgcolor="<%=sColor%>">
<td>1111</td>
<td>2222</td>
<td>3333</td>
<td>4444</td>
<td>5555</td>
</tr>
<%i = i + 1
Next%>
</table>
</div>


<input type=button value="Display" onclick="oSpan.style.display='block'">


the div disappears after you move the mouse off of the first <tr>.
I want the div to stay displayed untill you move the mouse off of
the entire table.

What am i missing?

[russell]

Hey LMF.

Really a JS question, but here goes. This is how I usually do it. I modified the top half of your code:

<script language=javascript>
v = null;
function hide(){
v = setTimeout("reallyHide()", 250);
}
function reallyHide() {
oSpan.style.display='none'
}

function dontHide() {
if(v) {
clearTimeout(v);
v = null;
}
}
</script>
<div onmouseout="hide();" id="oSpan" style="display:none;" cellpadding=0 cellspacing=0 bgcolor=black>
<table onmouseover="dontHide()" bgcolor=beige width=100% cellpadding=0 cellspacing=0 border=1>
Go CUBS !!!!!!!!!!!