position x/y du curseur

Version imprimable

30/05/2007, 12h18
yanice

position x/y du curseur
bonjour,
je cherche à récupérer la position de mon curseur lors d'un événement du type onClick.
j'ai trouvé ça dans la faq(http://javascript.developpez.com/faq...nt#SourisCoord) mais je n'arrive pas à l'adapter, je voudrai qqch de ce genre là :
Code:

1 2 3 4 5 mouse_x = 0; mouse_y = 0; mouse_x = window.event.clientX; mouse_y = window.event.clientY; document.getElementById("madiv").innerHTML = "X : "+mouse_x+" ; Y : "+mouse_y;

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<HTML> 
<HEAD> 
 
<SCRIPT LANGUAGE="JavaScript"><!-- 
if (navigator.appName == 'Netscape') { 
document.captureEvents(Event.MOUSEMOVE); 
document.onmousemove = netscapeMouseMove; 
} 
 
function netscapeMouseMove(e) { 
if (e.screenX != document.test.x.value && e.screenY != document.test.y.value) { 
document.test.x.value = e.screenX; 
document.test.y.value = e.screenY; 
} 
} 
 
function microsoftMouseMove() { 
if (window.event.x != document.test.x.value && window.event.y != document.test.y.value) { 
document.test.x.value = window.event.x; 
document.test.y.value = window.event.y; 
} 
} 
//--></SCRIPT> 
 
</HEAD> 
 
<BODY onmousemove="microsoftMouseMove()"> <!-- onmousedown="microsoftMouseMove()" onmouseup="microsoftMouseMove()" --> 
 
<FORM NAME="test"> 
X: <INPUT TYPE="TEXT" NAME="x" SIZE="4"> Y: <INPUT TYPUE="TEXT" NAME="y" SIZE="4"> 
</FORM> 
 
</BODY> 
</HTML>

Citation:

Envoyé par SpaceFrog

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<HTML> 
<HEAD> 
 
<SCRIPT LANGUAGE="JavaScript"><!-- 
if (navigator.appName == 'Netscape') { 
document.captureEvents(Event.MOUSEMOVE); 
document.onmousemove = netscapeMouseMove; 
} 
 
function netscapeMouseMove(e) { 
if (e.screenX != document.test.x.value && e.screenY != document.test.y.value) { 
document.test.x.value = e.screenX; 
document.test.y.value = e.screenY; 
} 
} 
 
function microsoftMouseMove() { 
if (window.event.x != document.test.x.value && window.event.y != document.test.y.value) { 
document.test.x.value = window.event.x; 
document.test.y.value = window.event.y; 
} 
} 
//--></SCRIPT> 
 
</HEAD> 
 
<BODY onmousemove="microsoftMouseMove()"> <!-- onmousedown="microsoftMouseMove()" onmouseup="microsoftMouseMove()" --> 
 
<FORM NAME="test"> 
X: <INPUT TYPE="TEXT" NAME="x" SIZE="4"> Y: <INPUT TYPUE="TEXT" NAME="y" SIZE="4"> 
</FORM> 
 
</BODY> 
</HTML>

En un peu plus compliant

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
/* getMouse : 
	Récupère les coordonnées de la souris et les met dans les variables globales 
		window.mouseX
	et	window.mouseY, 
		il faut passer event en paramètre sur les évènements
	ex : 
		function fun(param1, param2, e) {
			getMouse(e);
			sourisX = window.mouseX;
			sourisY = window.mouseY
		}
		fun("foo", "bar", event);
 
*/
/* getMouse :  */
function getMouse(e){
	var x,y; var elt = document.documentElement;
	if ( document.captureEvents ) {
		x = e.pageX;
		y = e.pageY;
	} else if ( window.event.clientX ) {
		x = window.event.clientX+elt.scrollLeft;
		y = window.event.clientY+elt.scrollTop;
	}
	window.mouseX = x;
	window.mouseY = y;
}

30/05/2007, 13h48
SpaceFrog

Oui bon je sais ça trahit mon age ...
j'ai resorti un vieux code ...
Mais en ce temps là c'est comme ça qu'on faisait mossieur ^^ :mouarf:

sauf que ton code ne marche pas sous FFX ...:king:
30/05/2007, 14h00
Gatsu35
Citation:

Envoyé par SpaceFrog

Oui bon je sais ça trahit mon age ...
j'ai resorti un vieux code ...
Mais en ce temps là c'est comme ça qu'on faisait mossieur ^^ :mouarf:

sauf que ton code ne marche pas sous FFX ...:king:

Non il ne marche pas sous Final Fantasy X mais sous Firefox Oui et si tu prenais la peine de lire les commentaires tu verrais pourquoi

exemple :
Code:

1 2 3 4 <body onmousemove="getMouse(event); this.innerHTML = window.mouseX"> </body>
oui je sais la demo est un peu crade.

Ensuite si tu veux la rajouter depuis le JS ta fonction :
Code:

1 2 3 4 5 document.body.onmousemove = function(e) { getMouse(event); this.innerHTML = window.mouseX; }
30/05/2007, 14h32
SpaceFrog

arf désolé j'étais resté sur getMouse(e) et pas event ... :oops:

Par contre pour FFX c'est son acronyme officiel ;)
30/05/2007, 14h35
Shinuza

Citation:

Envoyé par SpaceFrog

Oui bon je sais ça trahit mon age ...
j'ai resorti un vieux code ...
Mais en ce temps là c'est comme ça qu'on faisait mossieur ^^ :mouarf:

sauf que ton code ne marche pas sous FFX ...:king:

Ca date d'y a dix ans non? :mouarf:
30/05/2007, 14h36
SpaceFrog

Dix ans ... oui au moins si ce n'est plus ...

Bonjour

Une solution un peu plus simple :

Code:

1
2
3
4
5
6
7
8
 var xMouse, yMouse;
 
function posSouris(e)
       {
       xMouse = (navigator.appName.substring(0,3) == "Mic") ? event.x+document.body.scrollLeft : e.pageX ;
       yMouse = (navigator.appName.substring(0,3) == "Mic") ? event.y+document.body.scrollTop  : e.pageY ;
    }
(window.document.attachEvent)    ? window.document.attachEvent("onmousemove", posSouris) : window.addEventListener("mousemove", posSouris, false);

30/05/2007, 15h38
Shinuza

Et surtout mal codée :mouarf:

Citation:
Envoyé par roro06
Bonjour

Une solution un peu plus simple :
Code:

1 2 3 4 5 6 7 8 var xMouse, yMouse; function posSouris(e) { xMouse = (navigator.appName.substring(0,3) == "Mic") ? event.x+document.body.scrollLeft : e.pageX ; yMouse = (navigator.appName.substring(0,3) == "Mic") ? event.y+document.body.scrollTop : e.pageY ; } (window.document.attachEvent) ? window.document.attachEvent("onmousemove", posSouris) : window.addEventListener("mousemove", posSouris, false);
Ta solution est :
-Pas plus simple
-Se base sur le userAgent alors qu'il faut tester l'objet
-Passe par le onmousemove alors que ce n'est pas forcément sur le onmousemove qu'on cherche à détecter la position du curseur