J'ai utilisé le script que Truc m'a trouvé sur Google : http://www.trucsweb.com/Forum/voirmessa ... osparent=1
je l'ai appliquer a mon image en .jpg et surprise sous IE ça fonctionne niquel alors que sous FF j'ai l'impression (j'en suis quasi persuadé après mes tests) que en fait c'est le tableau de ma page qui le dérange
et si je vire l'image de mon tableau ça fonctionne alors je vois pas trop d'ou ça vient
le code source de ma page
Code : Tout sélectionner
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="inc/style.css" rel="stylesheet" type="text/css">
<style type="text/css">
#coord {
font-weight:bold;
background-color:#510000;
font-family: "Trebuchet MS";
font-size: 12px;
color: #999999;
}
</style>
<script language="JavaScript" type="text/javascript">
function twPositionRelative(evt)
{
var nOffsetX;
var nOffsetY;
evt = (evt) ? evt : ((window.event) ? window.event : "");
if (evt)
{
if (document.all)
{
nOffsetX = evt.offsetX;
nOffsetY = evt.offsetY;
}
else if (document.getElementById)
{
nOffsetX = evt.pageX - document.getElementById("carte_galaxie").offsetLeft;
nOffsetY = evt.pageY - document.getElementById("carte_galaxie").offsetTop;
}
document.getElementById("coord").innerHTML = "X : "+nOffsetX+" ; Y : "+nOffsetY;
}
}
function twInit()
{
var oImage = document.getElementById("carte_galaxie")
if (oImage)
{
oImage.style.cursor = "crosshair"
oImage.onmousemove = twPositionRelative
}
}
</script>
</head>
<body bgcolor="#333333" onLoad="twInit()">
<table width="930" border="0" align="center" cellpadding="0" cellspacing="0" style="border: 1px solid #000000;">
<tr>
<td colspan="3"><img src="img/b-h.jpg" width="930" height="20"></td>
</tr>
<tr>
<td height="165" colspan="3" background="img/b-session-on.jpg" style="padding-top: 13px; padding-left: 750px;">
<form action="#" method="post">
<table width="160" border="0" cellspacing="0" cellpadding="0" class="connexion">
<tr>
<td> <table width="160" border="0" cellspacing="0" cellpadding="0" class="connexion">
<tr>
<td align="left"> Identification : </td>
</tr>
</table>
<table width="160" border="0" cellspacing="0" cellpadding="0" class="connexion">
<tr>
<td >Login : </td>
<td align="right" valign="middle"> <input type="text" name="login" style="width: 115px;" class="connexion_input"></td>
</tr>
</table>
<table width="160" border="0" cellspacing="0" cellpadding="0" class="connexion">
<tr>
<td>Mot de Passe : </td>
<td align="right" valign="middle"> <input type="password" name="password" style="width: 70px;" class="connexion_input">
</td>
</tr>
</table>
<table width="160" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right" valign="middle" style="padding-right: 2px; padding-top: 5px;">
<input type="image" src="img/send.jpg">
</td>
</tr>
</table></td>
</tr>
</table>
</form></td>
</tr>
<tr>
<td colspan="3" bgcolor="#510000" style="padding-top : 3px; padding-bottom : 3px; color: #999999; text-align : center; border-top: 1px solid #000000; border-bottom: 1px solid #000000;">
<a href="#" class="menu_links">ACCUEIL</a> | <a href="#" class="menu_links">LISTE
D'ACHATS</a> | <a href="#" class="menu_links">BILAN</a> | <a href="#" class="menu_links">CARTE</a>
| <a href="#" class="menu_links">MEMBRES</a> | <a href="#" class="menu_links">RÈGLES</a>
| <a href="#" class="menu_links">FORUM</a> | </td>
</tr>
<tr bgcolor="#510000">
<td width="165"> </td>
<td width="600"> </td>
<td width="165"> </td>
</tr>
<tr bgcolor="#510000">
<td align="center" style="padding-top : 10px; padding-bottom : 10px;"> </td>
<td align="center"><img src="galaxie.jpg" width="600" height="600" id="carte_galaxie">
<p><span id="coord"></span></p></td>
<td> </td>
</tr>
<tr bgcolor="#510000">
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>