Coordonnées du curseur de la souris

Bonjour,

j'ai lu pas mal des sujet du forum concernant les coordonnées de souris mais je n'arrive toujours pas à solutionner mon problème.
Mon but est de récupérer les coordonnées du clic sur une image. Les coordonnées étant relative à l'image et non à la page.
Sous firefox ca semble marcher correctement , en revanche sous IE/Opera ... j'ai pour les coordonnées en Y des valeur trop petite (qui devienne négative si je suis trop sur le bord gauche de mon image. Les coordonnées en X sont quant à elles légèrement décalées.
Pour un clic au même endroit j'obtiens sous FF X:162 Y:163 (bonne valeur): et sous IE X:165 Y:22

Voici ce que j'ai fait

//Position en X de la souris
function getMouseX(e)
{
    if (!e) var e = window.event;
   if(window.opera)                                               //OP6
           return e.clientX;
   else if(document.all)                                           //IE4,IE5,IE6
           return document.body.scrollLeft+e.clientX;
   else if(document.layers||document.getElementById)               //N4,N6,Moz
           return e.pageX;
}
//Position en Y de la souris
function getMouseY(e)
{
    if (!e) var e = window.event;
   if(window.opera)                                                //OP6
           return e.clientY;
   else if(document.all)                                           //IE4,IE5,IE6
           return document.body.scrollTop+e.clientY;
   else if(document.layers||document.getElementById)               //N4,N6,Moz
           return e.pageY;
}

function posObj(obj,e)
{
	mouseX = getMouseX(e);
	mouseY = getMouseY(e);
	var curleft = curtop = 0;
	if(obj.offsetParent)
	{
		curleft= obj.offsetLeft;
		curtop = obj.offsetTop;
		while(obj = obj.offsetParent)
		{
			curleft+=obj.offsetLeft;
			curtop+=obj.offsetTop;
		}
	}
	// Position du curseur sur la page moins la position de l'image sur la page = position du curseur sur l'image
	PosMouseOnPicX = mouseX - curleft; 
	PosMouseOnPicY = mouseY - curtop;
	alert('X:'+PosMouseOnPicX+' Y:'+PosMouseOnPicY)
}

Et l'appel :

<img id="idImage" src="includes/createImage.php?act=1&cam=<?php echo $cam?>" width="384" height="288" onclick="posObj(this,event)" />

Une idée ?

Merci

Salut,

J'ai fait une petite page de test afin de tester les fonctions.

la fonction est la suivante :

function getScrollCursor(e){
    e = e || window.event;
    var curScrollX = (e.pageX)? e.pageX : e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
    var curScrollY = (e.pageY)? e.pageY : e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
    return {'x': curScrollX, 'y': curScrollY};
  }

Je n'est pas eu de probléme avec Opéra, juste un petit décalage de 2px sur Internet Explorer, je pense que les dévellopeur on penser a ça pour compenser le 3px margin bug... .

Merci de ta réponse,

Ce que tu fait ne me pose pas de problème non plus (malgrès un léger décalage également)
Ce que je veut faire c'est avoir la position de mon curseur sur une image (quelque soit sa position), pour faire simple que le coin en haut a gauche de mon image soit le 0,0 et le coin en bas à droite le 640,480 (pour une image de cette dimension)
Modifié par grunky (05 Dec 2007 - 08:26)

Je vais essayer de repartir de tes fonctions voir ce qui cloche chez moi.
Par contre il y'a toujours un décalage en fct du navigateur (de quelque pixel).

J'ai essayer en supprimant marges et bordure mais il est toujours présent.
Une idée ?

Merci