Un cadre s'affiche au passage du la sourie

var toolTipHorizontalOffset=10;
var toolTipVerticalOffset=10;

// This function should be called by the mouse move event.
function moveToolTip(evt)
{
	// Check to see if an event was passed
	evt=(evt) ? evt: ((event) ? event : null);
	if (!evt)
	{
//		window.alert("JavaScript Error: No event was passed to moveToolTip(evt).");
		return false;
	}

	// Find the scrollbar positions	
	scrollLeft=(document.body.scrollLeft) ? document.body.scrollLeft : document.documentElement.scrollLeft;
	scrollTop=(document.body.scrollTop) ? document.body.scrollTop: document.documentElement.scrollTop;		
	
	// Find the window dimensions
	bodyWidth=document.body.offsetWidth;
	bodyHeight=document.body.offsetHeight;
	//window.status=""+bodyWidth+", "+bodyHeight;

	// Check that the object can actually be found.
	if (!document.getElementById("ToolTip"))
	{
//		window.alert("JavaScript Error: Could not find ToolTip object in moveToolTip(evt).");
		return false;
	}
	
	// Get the X and Y co-ordinates of the event
	if (evt.pageX)  // Firefox and Mozilla
	{
		baseX=evt.pageX;
		baseY=evt.pageY;
	}
	else if (evt.clientX) // IE
	{	
		baseX=evt.clientX+scrollLeft;
		baseY=evt.clientY+scrollTop;
	}
	else
	{
		return false;
	}
	
	// Align the tooltip off to the top, bottom, left and right depending on where it is on the page.
	x=baseX+toolTipHorizontalOffset;
	y=baseY+toolTipVerticalOffset;
	if (baseX+document.getElementById("ToolTip").offsetWidth+toolTipHorizontalOffset>bodyWidth)
	{
		x=baseX-document.getElementById("ToolTip").offsetWidth-toolTipHorizontalOffset;
	}
	
	if (baseY+document.getElementById("ToolTip").offsetHeight+toolTipVerticalOffset>bodyHeight)
	{
		y=baseY-document.getElementById("ToolTip").offsetHeight-toolTipVerticalOffset;
	}
	
	// Make sure they can never disappear off the top or left edges
	if (x<=2) {	x=baseX+toolTipHorizontalOffset; }
	if (y<=2) {	y=baseY+toolTipVerticalOffset;	}
	if (x<=2) {	x=2; }
	if (y<=2) {	y=2; }
	
	// Set the new X and Y position for the tooltip
	document.getElementById("ToolTip").style.left=""+x+"px";
	document.getElementById("ToolTip").style.top=""+y+"px";
}

function setToolTipVisibility(newVisibility)
{
	// Check that the object can actually be found.
	if (!document.getElementById("ToolTip"))
	{
//		window.alert("JavaScript Error: Could not find ToolTip object in setToolTipVisibility(newVisibility).");
		return false;
	}
	
	// Set its visibility
	document.getElementById("ToolTip").style.visibility=newVisibility;
	if(newVisibility == "visible")
	{
		document.getElementById("ToolTip").style.display="inline";
	} else {
		document.getElementById("ToolTip").style.display="none";
	}
}

function setToolTipInnerHTML(newInnerHTML)
{
	// Check that the object can actually be found.
	if (!document.getElementById("ToolTip"))
	{
//		window.alert("JavaScript Error: Could not find ToolTip object in setToolTipVisibility(newInnerHTML).");
		return false;
	}
	
	// Set its innerHTML if it isn't already set to that value
	if (document.getElementById("ToolTip").innerHTML!=newInnerHTML)
	{
		document.getElementById("ToolTip").innerHTML=newInnerHTML;
	}
}

function showToolTip(newInnerHTML)
{
	setToolTipInnerHTML(newInnerHTML);
	setToolTipVisibility("visible");
}

function hideToolTip()
{
	setToolTipVisibility("hidden");
}

function initToolTip()
{
	
	if (document.all)
	{
		document.onmousemove=moveToolTip;
	}
	else
	{
		window.addEventListener("mousemove", moveToolTip, false);
	}
	
	
}

<script language="javascript" src="tooltip.js"></script>

<script language="javascript" type="text/javascript">
itemDesc[0]="";
itemDesc[0]+="<table style='color:#FFFFFF' cellspacing=0 cellpadding=0>";
itemDesc[0]+="<tr>";
itemDesc[0]+="<td><span class='itemTitle'>The Twin Calamities</span><br>";
itemDesc[0]+="<br>";
itemDesc[0]+="</td>";
itemDesc[0]+="<td><img src='/images/Icons/icon_item_1671.jpg' hspace='5'></td>";
itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan=2>";
	itemDesc[0]+="<font color='#FFFF00'>Découvert par</font><br>";
itemDesc[0]+="Crabbok<br>";
	itemDesc[0]+="Ethereal Legacy<br>";
		itemDesc[0]+="The Bazaar<br>";
	itemDesc[0]+="5 mars 2006</span> <br>";
	itemDesc[0]+="<br>";
	itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
	itemDesc[0]+="FABLED";
	itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
itemDesc[0]+="<tr>";
itemDesc[0]+="<td colspan='2'>";
itemDesc[0]+="<span style='text-transform:uppercase'><font color='#eaea88'><strong>";
	itemDesc[0]+="Histoire ";
	itemDesc[0]+="Inéchangeable ";
itemDesc[0]+="</strong></font></span><br>";
itemDesc[0]+="</td>";
itemDesc[0]+="</tr>";
itemDesc[0]+="<tr>";
itemDesc[0]+="<td colspan='2'>";
    	itemDesc[0]+="<span style='text-transform:capitalize'><font color='green'><strong>+26</strong></font></span>   <span style='text-transform:capitalize'><font color='green'><strong>Force</strong></font></span><br>";
    	itemDesc[0]+="<span style='text-transform:capitalize'><font color='green'><strong>+25</strong></font></span>   <span style='text-transform:capitalize'><font color='green'><strong>Agilité</strong></font></span><br>";
    	itemDesc[0]+="<span style='text-transform:capitalize'><font color='green'><strong>+26</strong></font></span>   <span style='text-transform:capitalize'><font color='green'><strong>Résistance</strong></font></span><br>";
    	itemDesc[0]+="<span style='text-transform:capitalize'><font color='green'><strong>+60</strong></font></span>   <span style='text-transform:capitalize'><font color='green'><strong>Mana</strong></font></span><br>";
    	itemDesc[0]+="<span style='text-transform:capitalize'><font color='green'><strong>+90</strong></font></span>   <span style='text-transform:capitalize'><font color='green'><strong>Santé</strong></font></span><br>";
itemDesc[0]+="</td>";
itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
	itemDesc[0]+="<font color='#7ed7df'><strong>Unleash Calamity</strong> </font> <br>";
	itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
		itemDesc[0]+="Dual Wield Pierce <br>";
			itemDesc[0]+="<strong>Dégâts:</strong> 22 - 66 ( 55,02  Classement) <br>";
				itemDesc[0]+="<strong>Délai:</strong>   1.6";
			itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";

	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
	itemDesc[0]+="<strong>Poids:</strong>   1 <br>";
	itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
		itemDesc[0]+="<strong>Cases:</strong> ";
					itemDesc[0]+="Primary";
			 				itemDesc[0]+=", ";
			 					itemDesc[0]+="Secondary";
			 			itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
																itemDesc[0]+="<strong>Niveau:</strong>   68 <br>";
								itemDesc[0]+="<strong>Moine</strong>";
				 					itemDesc[0]+=", ";
				 											itemDesc[0]+="<strong>Malabar</strong>";
				 							itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
	itemDesc[0]+="<tr>";
	itemDesc[0]+="<td colspan='2'>";
		itemDesc[0]+="<strong>Effets:</strong><br>";
					itemDesc[0]+='';
			itemDesc[0]+=" Applique Unleash Calamity quand Equipped <br>";
					itemDesc[0]+='<img src=\"/images/invis.gif\" width=\"20\">';
			itemDesc[0]+=" Sur une attaque réussie this spell has a 5% chance to cast Ruinous Strike on target of attack.   <br>";
					itemDesc[0]+='<img src=\"/images/invis.gif\" width=\"20\"><img src=\"/images/invis.gif\" width=\"20\">';
			itemDesc[0]+=" Inflige 5 - 8 de dégâts magie sur Cible  <br>";
					itemDesc[0]+='<img src=\"/images/invis.gif\" width=\"20\"><img src=\"/images/invis.gif\" width=\"20\">';
			itemDesc[0]+=" Decreases Mitigation of Cible  vs piercing damage by 36 <br>";
			itemDesc[0]+="</td>";
	itemDesc[0]+="</tr>";
itemDesc[0]+="</table>";
</script>
			<a href="url de ta page cible" onMouseOver="showToolTip(itemDesc[0]);" onMouseOut="hideToolTip();" style="cursor:default ;"><img src="url de ton image.jpg" width="42" height="42" border="0" class="itembox"></a>
	</td>

<a href="l adresse de la page qui  apparaitra quand on click sur l image boutton " onMouseOver="showToolTip(itemDesc[0]);" onMouseOut="hideToolTip();" style="cursor:default ;"><img src="l image que l on vois et qui sert de boutton" width="42" height="42" border="0" class="itembox"></a>