mouvement continu sur survol d'objet

**jihelge** · 13/05/2012, 16h29

Bonjour à tous,
Je ne pose que très rarement de question (en fait jamais) car en général je trouve avant en vous lisant ou en travaillant (élève sage).

Mon souci est le suivant :
Je veux faire bouger un objet ou agir sur lui (fait) mais au lieu de cliquer je veux survoler par exemple une div et là ou sa se corse: "tantque je suis au dessus le mouvement continu, dès que le focus sort de l'objet le mouvement s'arrête".

J'ai essayé avec des onmouseover et onmouseout avec bascule while( bascule)... j'ai mis un timer, mais soit je ne générère qu'un seul appel sur l'événement, soit je part en boucle et le timer ne suffit pas pour capter le onmouseout.

si quelqu'un a une idée ça m'arrangerais beaucoup.
merci d'avance (et déjà de m'avoir lu).

**Willpower** · 13/05/2012, 16h55

Set et Clear Interval ?

Code :

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

1
2
3
4
5
6
7
8
9
10
var interval;
elem.onmouseover = function(){
    clearInterval(interval); // pour être sûr que le précédent interval n'existe plus,  bien qu'un 2ème "over" sans "out" ne me semble pas possible
    interval = setInterval(function(){
        // animation toutes les secondes
    },1000);
};
elem.onmouseout = function(){
    clearInterval(interval);
};

**jihelge** · 13/05/2012, 17h02

Merci beaucoup willpower

J'ai travaillé entre temps et j'ai fait ce petit truc qui fonctionne.

Je vais essayer le tien qui me semble plus élégant

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
var actif=false;
 
function mouvement ( xpos, ypos)
{
 
	/* xpos valeur de mouvement en x (incrément)*/
	/* ypos valeur de mouvement en y (incrément)*/
	var valeurx;// relevé de la position absolue en x
	var valeury;// relevé de la position absolue en y
 
	/*** bla bla bla bla
	traitement du mouvement
	*/
 
	if( actif )setTimeout("mouvement ("+xpos+","+ypos+")",50);
 
}
 
      </script> 
  </head>
  <body>
	<div id='ecran' >
	<div id="calq" style="position : absolute;left:100px;top:100px;height:100px;width:100px;background:#fff;" >du texte dans la div en mouvement</div>
 
	<div id="bouton" onmouseover="actif=true;mouvement(+10,0);" onmouseout="actif=false;"></div>
 
 
	</div>
 
</body>

Bon ben maintenant je vais chercher le machin pour dire que c'est résolu

merci beaucoup de ta promptitude !

**Willpower** · 13/05/2012, 17h11

Envoyé par jihelge

Bon ben maintenant je vais chercher le machin pour dire que c'est résolu

Tout en bas à droite. (il est bien caché^^)

Sinon effectivement dans ton cas un interval est plus adapté qu'un timeout.

Et petite remarque en passant, on conseille généralement d'utiliser une function plutôt qu'un string d'instructions à l’intérieur des setTimeout et SetInterval notamment pour s'assurer du contexte (portée des variables).

Utiliser :

Code :

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

setTimeout(function(){instruction1;instruction2;},delay);

Au lieu de :

Code :

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

setTimeout("instruction1;instruction2;",delay);

**jihelge** · 13/05/2012, 17h21

Ok merci bien pour ces conseils. En ce moment je produit un peu au kilomètre et j'ai tendance à oublier les bons usages.

Pour l'intervalle ok tu as raison.

Aller je retourne au taf.

mouvement continu sur survol d'objet

JavaScript

Discussions similaires

Partager

Partager