I'm trying to understand this and don't get it...
I found some code that looks like it's going to work if I can make
sense of how to position the div.
The code displays a div with some data when I mouse over an element (A
column in an ASP.NET Gridview, but I suppose that's not important)
Everything works great, except I can't seem to position the div where I
want given scrolling.
pardon the comments and failed attempts.
the javascript:
<script language="javascript" type="text/javascript">
function ShowTooltip(L1,L2)
{
document.getElementById("L1").innerText=L1;
document.getElementById("L2").innerText=L2;
//x = event.clientX + document.body.scrollLeft;
y3 = event.clientY + document.body.scrollTop + 10;
y = event.y ;
yy = event.offsetY;
//x = event.clientX ;
//y = event.clientY ;
//y = event.clientY ;
status= y + ' ' + yy + ' ' +y3;
var Popup= document.getElementById("Popup")
Popup.style.display="block";
Popup.style.position="absolute";
Popup.style.left = 230;
//Popup.style.top = y + 650
Popup.style.top = y;
Popup.style.background="#D2D5DE";
}
function HideTooltip()
{
document.getElementById("Popup").style.display="no ne";
}
</script>
The Div:
</div>
<div id="Popup" class="transparent" >
<table >
<tr>
<td id="L1" align="left"</td>
</tr>
<tr>
<td id="L2" align="left"</td>
</tr>
</table>
</div>
The code that sets what to do onmouseover:
e.Row.Cells(0).Attributes.Add("onmouseover", "ShowTooltip(r,pdate);")
e.Row.Cells(0).Attributes.Add("onmouseout", "HideTooltip();")
So my question is... If the grid is around 700px from the top, and
dispays about 10 rows, and apparently row is what the event is changing
on, how can have the popup showup just left of the row item i've
hovered over. It seems to me both clientY and offsetY are affected by
scrollpositon. and event.OffsetY appear to be relative to the row I'm
hovering over so it don't seem like it will be much help Perhaps If I
could get the Y of the cursor from the very top of the page that might
be good enough.