pendant de onmousemove ...

**SpaceFrog** · 07/12/2005, 17h04

tout le monde connait le rollover avec onmouseover onmouseout ...

je cherche à faire le même genre de truc mais avec onmousemove pour le declencheur mais du coup je ne sais pas quoi mettre comme stoppeur ???

**siddh** · 07/12/2005, 17h31

onmousenotmove ?

plus serieusement, tu souhaiterais donc reussir a savoir quand le mousemove s'arrete ?

explique moi plus ce que tu voudrais comme resultat stp.

**SpaceFrog** · 07/12/2005, 17h44

yes siddh quand le mouse is move pas

le but:
je fais actuellement un rollover sur une image et modifie son src...

je voudrais le même effet mais si le curseur bouge sur le page =>image1 et si il ne bouge pas=> image2

sans m'embarquer dans un setInterval ...

**siddh** · 07/12/2005, 17h53

Envoyé par SpaceFrog

sans m'embarquer dans un setInterval ...

ca serais pas drole :p

ok je cogite, c est interressant

**siddh** · 07/12/2005, 23h46

rien de bien concluant pour l instant, je regardes du coté gestion dom des evenements pour voir si avec les listener y aurais pas quelquechose a faire

**denisC** · 08/12/2005, 08h22

Envoyé par SpaceFrog

sans m'embarquer dans un setInterval ...

Euh, j'avoue que je ne vois pas comment tu peux faire ce genre de chose sans setTimeout (pas besoin d'un interval, mais un timeout...).

Pour moi, la façon de faire ce qeu tu cherches à faire (si j'ai bien compris ce que tu dis que tu cherches à faire à comprendre de chercher le fer ....), tu changes d'images sur le onmousemove, en mettant un timeout pour le retour à l'image initial, et ça devrait le faire.

Et en utilisant seulement les evenements, je vois pas. Onmousenotmove n'est pas un évenement, ça serait plutot un non évenement. Et pour gerer les non-evenements, a part une boucle infini (= setInterval), je ne vois pas...

Mais la solution ci-dessus devrait fonctionner

Bonne chance

**SpaceFrog** · 08/12/2005, 08h40

ha oui je vois le principe

sur le onmousemouve je change le src puis je lance un setTimeout pour remodifier l'image de départ ...
faut juste que je teste le time pour voir à parti de quel moment ça clignote ...

merci DenisC je vais tester ça...
merci Siddh de ton intérêt

**SpaceFrog** · 08/12/2005, 08h50

Bon ben voilà :

Code :

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

1
2
3
4
function Phares(ObjSrc){
	ObjSrc.src="TaxImages/pass5on.gif"
	setTimeout(function(){ObjSrc.src='TaxImages/pass5.gif'},300)
	}

en intergrant un appel à la focntion dans le onmousemouse du body on obtient un toggle d'image sur le mouvement de la souris

Encore merci les gars !

**SpaceFrog** · 08/12/2005, 09h07

heu en fait pas si simple que ça parceque j'obtiens un clignotement même si le curseur ne bouge pas ...

**siddh** · 08/12/2005, 09h08

hum j avais fais cette solution mais pas reussi a trouver un moment sans clignotant

**denisC** · 08/12/2005, 09h08

Envoyé par SpaceFrog

function Phares(ObjSrc){
ObjSrc.src="TaxImages/pass5on.gif"
setTimeout(function(){ObjSrc.src='TaxImages/pass5.gif'},300)
}

Euh, j'aurais quand même nommé le setTimeout, en le clearant avant de le remettre.

Quelque chose du genre:

Code :

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

1
2
3
4
5
function Phares(ObjSrc){
	ObjSrc.src="TaxImages/pass5on.gif";
         window.clearTimeout(ObjSrc.timeout);
	ObjSrc.timeout=setTimeout(function(){ObjSrc.src='TaxImages/pass5.gif'},300);
	}

A mon avis, le rendu sera meilleur, et tu as moins de risque de rammage de la chose pour cause de changement d'image dans tous les sens...

Tu suis?

**SpaceFrog** · 08/12/2005, 09h20

curieux... même avec le cleartimeout j'ai toujours un clignotement sans que le curseur ne bouge ... ?

sinon il est vrai qu'au niveau du rendu c'est parfait (forcément ça rame moins !)

**denisC** · 08/12/2005, 09h31

Envoyé par SpaceFrog

curieux... même avec le cleartimeout j'ai toujours un clignotement sans que le curseur ne bouge ... ?

Si tu me postes un exemple que je puisse tester et bidouiller, je veux bien essayer de faire qqch. (je suis un peu flemme aujourd'hui, j'ai pas envie d'écrire l'exemple moi-même).
A mon avis, il faut peut-être mettre un timeout aussi pour le changement initial d'image (à voir).

Sinon, le fait que ça rame moins, c'est assez logique. Précédemment, pour chaque mouvement de la souris, tu créeais un nouveau timeout, qui s'executait, changeais d'image, et tu rechangeais par dessus si la souris bougeait encore

Des finitions à faire, donc....

**SpaceFrog** · 08/12/2005, 09h41

deux images pass.gif et passon.gif dans le même repertoire qua la page ...

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
<script type='text/javascript'>
function Phares(ObjSrc){
   if(ObjSrc.src="pass5on.gif"){return false;}
   ObjSrc.src="pass5on.gif";
   window.clearTimeout(ObjSrc.timeout);
   ObjSrc.timeout=setTimeout(function(){ObjSrc.src='pass5.gif'},300);
   }
 
</script>
 
 
</head>
 
<body onmousemove="Phares(document.getElementById('car1'))">
					<img id="car1" src="pass5.gif" style="float:right;margin:10px 20px 50px 50px;" />

ou le fait de nettoyer le timeout n'empèche pas le log de lancement de la fonction je crois ... ce qui expliquerait le cligontement ?

autre curiosité si le curseur n'est pas sur la fenetre ça e cligonte plus ??
c'est donc peut être liè à la souris ?
j'ai une souris optique ... pouvez vous tester avec une souris normale

j'ai rajouté un test sur le src de façon à éviter les accumulations

**SpaceFrog** · 08/12/2005, 09h48

Arrrhg

il semblerait que ce soit bien la souris optique qui soit en cause, sans doute du à son mode de fonctionnement elle doit generer des mouvements infimes et donc influer sur le mousemove !

**denisC** · 08/12/2005, 09h57

Envoyé par SpaceFrog

if(ObjSrc.src="pass5on.gif"){return false;}

J'ai pas compris l'interet de ce test (et l'histoire d'accumulation), mais effectivement, avec une souris mécanique, ça fonctionne bien. (enfin, pas sous Opéra, c'est assez louche, mais sous IE et FFx ok).

Donc le problème est lié à la souris optique qui doit tout le temps être en train de bouger. Donc tout ce que je peux te conseiller est, pour le changment initial d'image, de vérifier la position de deux evenements consécutif pour voir si la souris bouge bien ou non.
En fait, refaire le onmousemove pour prendre en compte les souris optiques

Quelque chose du gout:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
function Phares(ObjSrc,event){
   eX = event.pageX;
   eY = event.pageY;
   if (ObjSrc.previousEventX&&ObjSrc.previousEventY&&(abs(ObjSrc.previousEventX-eX)>2||abs(ObjSrc.previousEventY-eY)>2)) {
      ObjSrc.previousEventX=eX;
      ObjSrc.previousEventY=eY;
      ObjSrc.src="pass5on.gif";
      window.clearTimeout(ObjSrc.timeout);
      ObjSrc.timeout=setTimeout(function(){ObjSrc.src='pass5.gif'},300);
      }
   }