Menu
With the script below, the foto appears in the left upper corner from the sreen and disappear when I scrolling down, and not on the place where the mouse goes over: here Name.
What I have to change?
<style type=”text/css”>
#plaatje {
position:absolute;
z-index:1000;
visibility:hidden; }
</style>
<script type=”text/javascript”>
function init() {
if (window.Event) {document.captureEvents(Event.MOUSEMOVE);}
document.onmousemove = haalMuisPositie; }
function haalMuisPositie(e) {
muisX = (window.Event) ? e.pageX : event.clientX;
muisY = (window.Event) ? e.pageY : event.clientY; }
<head>
function toonPlaatje(naam,beeldje) {
laag = document.getElementById(naam);
laag.innerHTML = ‘<img src=’ +beeldje+’>’;
laag.style.visibility = “visible”;
laag.style.top = muisY + “px”;
laag.style.left = muisX + “px”;
plaatsPlaatje() }
function verbergPlaatje(naam){
laag = document.getElementById(naam);
laag.style.visibility = “hidden”; }
function plaatsPlaatje() {
laag.style.top = muisY + “px”;
laag.style.left = muisX + “px”; }
</script>
</head>
<body onload=”init()”>
<div id=”plaatje”></div>
<table >
<tr>
<td><a onmouseover=”toonPlaatje(‘plaatje’,’foto.JPG’);” onmouseout=”verbergPlaatje(‘plaatje’);”>Name</a></td>
</tr>
</table>
</body>
etc.