position x/y du curseur

**yanice** · 30/05/2007, 12h18

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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;

**SpaceFrog** · 30/05/2007, 13h17

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

**Gatsu35** · 30/05/2007, 13h27

Envoyé par SpaceFrog

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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;
}

**SpaceFrog** · 30/05/2007, 13h48

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 ^^

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

**Gatsu35** · 30/05/2007, 14h00

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 ^^

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

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
document.body.onmousemove = function(e) {
   getMouse(event);
   this.innerHTML = window.mouseX;
}

**SpaceFrog** · 30/05/2007, 14h32

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

Par contre pour FFX c'est son acronyme officiel

**Shinuza** · 30/05/2007, 14h35

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 ^^

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

Ca date d'y a dix ans non?

**SpaceFrog** · 30/05/2007, 14h36

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

**roro06** · 30/05/2007, 15h07

Bonjour

Une solution un peu plus simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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);

**Shinuza** · 30/05/2007, 15h38

Et surtout mal codée

**Gatsu35** · 30/05/2007, 15h48

Envoyé par roro06

Bonjour

Une solution un peu plus simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

position x/y du curseur

JavaScript

Discussions similaires

Partager

Partager