Forum Moderators: open
I've created a text family tree, I want to show person's picture when mouse is over the person's name, it works with a few lines, but if I have to scrolled down the page, I lost my picture, how can I show the picture always at the same location of cursor?
Here is my html page:
<head>
<script type="text/javascript">
<!--
function showPerson(imgsrc, e){
var x = e.clientX;
var y = e.clientY;
var im = document.getElementById("persPic");
im.style.left = (x+2) + "px";
im.style.top = (y+2) + "px";
im.src = imgsrc;
im.style.display="block";
}
function hidePerson(){
var im = document.getElementById("persPic");
im.style.display="none";
}
-->
</script>
</head>
<body>
<img id="persPic" src="" alt="Person's image" style="position:absolute; top:0px; left:0px; display:none;" />
<a href="#" onmouseover="showPerson(Person's image, event);" onmouseout="hidePerson();">Person's name</a>
</body>
Thank you for your help.
