11490 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
je cherche à récupérer la position de la souris quand je pointe sur un lien. Voici le script que j'ai écris :
<script>
var mouseX, mouseY;
    function getMouseXY(e)
    { 
      if (!e) e = window.event; 

      if (e)
      { 
        if (e.pageX || e.pageY)
        {
          mouseX = e.pageX;
          mouseY = e.pageY;
          algor = '[e.pageX]';
          if (e.clientX || e.clientY) algor += ' [e.clientX] '
        }
        else if (e.clientX || e.clientY)
        {
          mouseX = e.clientX + document.body.scrollLeft;
          mouseY = e.clientY + document.body.scrollTop;
          algor = '[e.clientX]';
          if (e.pageX || e.pageY) algor += ' [e.pageX] '
        }  
      }
    }

    function Show()
    {	
		getMouseXY(window.event)
		alert(mouseX + " " + mouseY);
    }
</script>
<a href="" onMouseOver="Show()">Move the mouse over here</a><br>

Il marche sous IE mais pas sous Firefox. Savez-vous pourquoi ? Comment le corriger pour que ça marche aussi sur FF ?

merci d'avance pour votre aide.
Modifié par mathmax (02 Jan 2007 - 20:43)
Désolé pour le formattage du code. J'ai complètement oublié.
Ton script ne marche pas non plus. Voici ce que j'ai écris :


<script>
	function doSomething(e) {
		var posx = 0;
		var posy = 0;
		if (!e) var e = window.event;
		if (e.pageX || e.pageY) 	{
			posx = e.pageX;
			posy = e.pageY;
		}
		else if (e.clientX || e.clientY) 	{
			posx = e.clientX + document.body.scrollLeft
				+ document.documentElement.scrollLeft;
			posy = e.clientY + document.body.scrollTop
				+ document.documentElement.scrollTop;
		}
		alert(posx + " " + posy);
	}
</script>
<a href="" onMouseOver="doSomething(window.event)">Move the mouse over here</a><br>


Ais-je oublié quelque chôse ?
Modifié par mathmax (02 Jan 2007 - 20:47)
Ca n'affiche rien dans Firefox. C'est bien là le problème. Ca marche bien par contre dans Internet Explorer. Je reçois une alerte avec les coordonnées de la souris quand je pointe sur le lien.
Modifié par mathmax (02 Jan 2007 - 21:58)
Et en enlevant le window.event quand tu appelles la fonction çà donne quoi ?
Et si çà fait toujours rien, qu'y a-t-il dans la console d'erreurs ?
J'ai çà si tu veux, il y a peut-être mieux mais çà marche :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
<!--
function start_position(){
 posx = 0;
 posy = 0;
 enableDisplayPosition=0;
 document.onmousemove = doSomething;
}
function doSomething(e) {
 if(enableDisplayPosition==1){
	if (!e) var e = window.event;
	if (e.pageX || e.pageY){
		posx = e.pageX;
		posy = e.pageY;
	}
	else if (e.clientX || e.clientY){
		posx = e.clientX + document.body.scrollLeft+document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop+document.documentElement.scrollTop;
	}
	document.getElementById('pos').value=posx + ' ' + posy;
  enableDisplayPosition=0;
 }
}
//-->
</script>
</head>
<body onload="start_position()">
<a href="#" id="tonlien" onmouseover="enableDisplayPosition=1;">Passez moi dessus</a><br />
<input type="text" id="pos" />
</body>
</html>


C'est tout ce que je sais faire, j'ai jamais compris le truc de l'évènement.

Si tu voulais la position en temps réel tant que la souris est sur le lien tu peux jouer avec le onmouseout pour passer la variable enableDisplayPosition à 0.
Modifié par CNeo (02 Jan 2007 - 23:09)
impeccable ! merci beaucoup Smiley smile En fait c'est le onmousemove="doSomething(window.event)" qui faisait buger. Il faut générer l'événement par le code.
Je comprends pas pourquoi les navigateurs n'essaient pas de comprendre tous de la même manière le javascript. Ca fait perdre un temps fou au développeur. Smiley fache
Modifié par mathmax (03 Jan 2007 - 00:20)
Bonsoir
mathmax a écrit :

<script>
	function doSomething(e) {
		var posx = 0;
		var posy = 0;
		if (!e) var e = window.event;
		if (e.pageX || e.pageY) 	{
			posx = e.pageX;
			posy = e.pageY;
		}
		else if (e.clientX || e.clientY) 	{
			posx = e.clientX + document.body.scrollLeft
				+ document.documentElement.scrollLeft;
			posy = e.clientY + document.body.scrollTop
				+ document.documentElement.scrollTop;
		}
		alert(posx + " " + posy);
	}
</script>
<a href="" onMouseOver="doSomething(window.event)">Move the mouse over here</a><br>


Ais-je oublié quelque chôse ?
Il faut écrire :
onmouseover="doSomething(event);"
C'est un peu plus propre que la solution de CNeo.
Modifié par Eldebaran (03 Jan 2007 - 00:23)
Eldebaran a écrit :
BonsoirIl faut écrire :
onmouseover="doSomething(event);"
C'est un peu plus propre que la solution de CNeo.
Merci. J'ai testé çà marche si çà ne sert pas au créateur du sujet en tout cas çà va me servir à moi.