Centrer une popup au passage de la souris

voilà le code : ) Merci pour l'aide, sympa

<script>

function Target(id, picture, width, height)
{
this.id = id;
this.ref = null;
this.width = width;
this.height = height;
this.picture = picture;
}

// Attention : offsetHeight ne fonctionne que si l'élément ne comporte ni marges, ni bordures, ni padding sinon ...
Target.prototype.getHeight = function()
{
var elt = document.getElementById(this.id);
return elt.offsetHeight;
}

Target.prototype.getWidth = function()
{
var elt = document.getElementById(this.id);
return elt.offsetWidth;
}


function TargetList(popupId, popupWidth, popupHeight)
{
this.popupId = popupId;
this.popupWidth = popupWidth;
this.popupHeight = popupHeight;
this.items = new Array();

this.currentIndex = -1;
}

TargetList.prototype.addTarget = function(id,picture,width,height)
{
var item = new Target(id,picture,width,height);
item.index = this.items.length;

var elt = document.getElementById(id);
this.items.push(item);
}

TargetList.prototype.hidePopup = function()
{
if (this.currentIndex != -1)
{
document.getElementById(this.popupId).style.left=-10000+"px";
this.currentIndex = -1;
}
}

TargetList.prototype.selectTarget = function(index)
{
if (this.currentIndex != index)
{
if ((index >=0) && (index < this.items.length))
{
document.getElementById(this.popupId).innerHTML='<img src="'+this.items[index].picture+'">';
this.currentIndex = index;
}
}
}

TargetList.prototype.showPopup = function(x,y)
{
var elt = document.getElementById(this.popupId);
elt.style.left=x+5+"px";
elt.style.top=y-this.popupHeight+"px";
}

TargetList.prototype.findTarget = function(x,y)
{
var index = -1;
for (var i=0; i < this.items.length; i++)
{
var position = findPosition(this.items[i].id);
if ((x >= position.x) && (x < position.x+this.items[i].getWidth()) && (y >= position.y) && (y < position.y+this.items[i].getHeight()))
{
index = i;
break;
}
}
return index;
}


var targetList = new TargetList("popup",400,250);




function strToNumber(value)
{
var nbr = parseInt(value);
if (isNaN(nbr)) { nbr = 0;}
return nbr;
}

// Retourne la position de la souris sur la page (et pas sur l'écran !)
function mousePosition(e)
{
var result = new Array();
result["x"] = 0;
result["y"] = 0;
if (!e) var e = window.event;
if (e.pageX || e.pageY) {
result["x"] = e.pageX;
result["y"] = e.pageY;
}
else if (e.clientX || e.clientY) {
result["x"] = e.clientX + document.body.scrollLeft
+ document.documentElement.scrollLeft;
result["y"] = e.clientY + document.body.scrollTop
+ document.documentElement.scrollTop;
}
return result;
}

// Retourne la position absolue d'un objet sur la page
function findPosition(id)
{
var elt = document.getElementById(id);
var result = new Array();
result["x"] = 0;
result["y"] = 0;
while (elt)
{
result["x"] += elt.offsetLeft;
result["y"] += elt.offsetTop;

elt = elt.offsetParent;
}

return result;
}

function mouseMove(e)
{
var mouse = mousePosition(e);
index =targetList.findTarget(mouse.x,mouse.y);

if (index != -1)
{
targetList.selectTarget(index);
targetList.showPopup(mouse.x,mouse.y);
}
else
{
targetList.hidePopup();
}
}


function load()
{
targetList.addTarget("image1","../images/01_projets/P01_place_riponne/P1_1_riponne.jpg",567,281);
targetList.addTarget("image2","../images/01_projets/P01_place_riponne/P1_2_riponne.jpg",454,362);
targetList.addTarget("image3","../images/01_projets/P01_place_riponne/P1_3_riponne.jpg",453,362);
targetList.addTarget("image4","../images/01_projets/P01_place_riponne/P1_4_facade_nord_jour.jpg",595,421);
targetList.addTarget("image5","../images/01_projets/P01_place_riponne/P1_5_retouche.jpg",595,421);
targetList.addTarget("image6","../images/01_projets/P01_place_riponne/P1_6_retouche2.jpg",595,421);
targetList.addTarget("image7","../images/01_projets/P01_place_riponne/P1_7_toiture_jour.jpg");
targetList.addTarget("image8","../images/01_projets/P01_place_riponne/P1_8_testfilm3m.jpg");
targetList.addTarget("image9","../images/01_projets/P01_place_riponne/P1_9_Passage_FINAL.jpg");
targetList.addTarget("image10","../images/01_projets/P01_place_riponne/P1_10_riponne.jpg");
targetList.addTarget("image11","../images/01_projets/P01_place_riponne/P1_11_parking.jpg");



document.onmousemove=mouseMove;
}

</script>


</head>

<body onload="load()">
<div class="popup" id="popup"></div>

<table width="1020" height="600" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="image"><img src="../images/01_projets/P01_place_riponne/mini_P1_1_riponne.jpg" id="image1"></td>
<td class="spaceh"> </td>
<td class="image"><img src="../images/01_projets/P01_place_riponne/mini_P1_2_riponne.jpg" id="image2"></td>
...etc...