Afficher les coordonnées de la souris en fonction d'une image

Bonjour,

J'aurai besoin, dans le cadre d'une application web, d'un Javascript qui détecterai la position de la souris sur une image (en fonction de celle-ci).

J'ai cherché et j'ai trouvé un code qui fonctionne sous IE, mais qui ne fonctionne ni sous Firefox, ni sous Netscape...forcément. Faisant un peu de Javascript quand il le faut mais n'étant pas un féru, je me permets de venir demander votre aide.

Voici le code en question :

<script language="JavaScript1.2">
<!--
startx = 0;
starty = 0;

var IE = document.all?true:false

function moveL()
{
   xv = tempX;
   yv = tempY;
}

if (IE&&myimage.filters)
document.all.myimage.onmousemove = getMouseXY;

var tempX = 0
var tempY = 0


function getMouseXY(e)
{
   tempX = event.offsetX
   tempY = event.offsetY

   if (tempX < 0){tempX = 0}
   if (tempY < 0){tempY = 0}
   if (t)
   { 
      moveL();
   }

   return true
}

var xv = startx;
var yv = starty;
var t= true;

if (IE&&myimage.filters)
{
   myimage.style.cursor="crosshair";
}

function souris ()
{
window.status="X : "+xv+" ; Y : "+yv;
document.form1.a.value = xv;
document.form1.b.value = yv;
}
// -->
</script>

Le script renvoie les coordonnées dans 2 champs texte et dans la barre de statut (facultatif).

Serait-il possible de l'adapter pour qu'il fonctionne sous d'autres navigateurs ?

En vous en remerciant d'avance.

Tu comptes recuperer les coordonnées d'un clique pour savoir ou diriger l'utilisateur en fonction de l'endroit ou il a cliqué ?

Si oui ... un <input type="image"> te permet de faire cela en recuperant cote serveur (via PHP par exemple) ces coordonnées. Dans ce cas la méthode est plus accessible que le javascript

Cela dit tu ne souhaites peut-etre pas du tout faire cela

PS : "mais qui ne fonctionne ni sous Firefox, ni sous Netscape...forcément."
Pourquoi ce "forcement" un peu médisant ?
Modifié par afbilou (31 Jul 2005 - 11:36)

afbilou a écrit :
Tu comptes recuperer les coordonnées d'un clique pour savoir ou diriger l'utilisateur en fonction de l'endroit ou il a cliqué ?

Si oui ... un <input type="image"> te permet de faire cela en recuperant cote serveur (via PHP par exemple) ces coordonnées. Dans ce cas la méthode est plus accessible que le javascript

Petite précision : quelque-soit la méthode (image map côté serveur, astuce javascript sur une image, input type="image"...) le résultat aura une accessibilité très médiocre et nécessitera une solution de repli indépendante de l'acquisition de ces coordonnées : pensez tout simplement aux navigateurs non graphiques

Mais il reste à voir dans quels termes se pose exactement la question de l'accessibilité dans cette "application Web" envisagée par Xoran
Modifié par Laurent Denis (31 Jul 2005 - 11:44)

En fait c'est une application web qui ne sera accessible qu'à un nombre restreint de personnes, ce qui en terme d'accessibilité relativise un peu les choses.

Dans ce cas j'ai vraiment besoin des coordonnées x,y de la souris par rapport à l'image (au pixel près).

En ce qui concerne Firefox ou Netscape, ce n'était pas de la médisance. Je soulignais plus le fait que Firefox et Netscape utlise tout deux l'excellent moteur Gecko.

Merci à vous.

Bonjour,

var D=document;gk=window.Event; //Gecko
de=!D.documentElement.clientWidth?
D.body:D.documentElement // IE6 XHTML
sx=gk?pageXOffset:de.scrollLeft      //scroll h
sy=gk?pageYOffset:de.scrollTop       //scroll v
x=gk?e.pageX:event.clientX+sx;       //curseur x
y=gk?e.pageY:event.clientY+sy;       //curseur y

Modifié par chmel (01 Aug 2005 - 21:12)

Ok solo , mais :

document.body.scrollLeft

ne marche pas en xhtml strict
et :

document.captureEvents(Event.MOUSEMOVE);

est pour NS4
Ce que j,ai proposé suffit

Encore un tout grand merci, je vais essayer cela !