Fonction faite une fois de trop ?

LowTiste · 13/04/2011, 11h28

Bonjour,

J'ai une image qui rebondi, je fais donc varier son ordonné et son abscisse(pour le moment que l'abscisse). L'image arrive parfaitement à rebondir de haut en bas mais au bout d'un moment sa vitesse augmente, comme si elle passait deux fois dans la même fonction.. J'ai un peu de mal à voir où se situe exactement mon erreur.
Voici mon script :

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<html>
<head>
 <title></title>
<script type="text/javascript">
    var rebond1= 0;
    var rebond0= 1;
    var rebond_limit=1;
    var limitw = -100;
    var limith = -100;
    abcisse = 0;//abcisse du coin sup&eacute;rieur gauche de l'image
    ordonnee = 0;//ordonnee du coin sup&eacute;rieur gauche de l'image
    vitesse = 150;//vitesse du mouvement : vous pouvez changer cette valeur
function load()
{
    document.getElementById("imgb").style.backgroundPosition= '0px -95px';//positionnement horizontal de l'image
    //document.getElementById("imgb").style.top = ordonnee;//positionnement vertical de l'image
    img_monte(1,-100);
}
 
function img_descente(limit_atteinte,limith){
//alert('fonctiondescencte');
var unePos = document.getElementById('imgb').style.backgroundPosition;
 
var elem = unePos.split(' ');
ordonnee = elem[0];
abscisse = elem[1];
 
var ordo = ordonnee.split('px');
ordonneeC = ordo[0];
 
var absc = abscisse.split('px');
abscisseC = absc[0];
 
ordonneeC = parseInt(ordonneeC);
abscisseC = parseInt(abscisseC);
 
 
//abscisseC= abscisseC+1;
//alert(abscisseC);
//ordonneeC= ordonneeC+1;
//alert(ordonneeC);
 
if (rebond_limit==limit_atteinte)
{
         abscisseC=abscisseC+2;
         newabs= abscisseC;
}
else
{
    //***descente d'1px***
    abscisseC= abscisseC+1;
    alert(abscisseC);
}
if(abscisseC<limith)
{
    newabs= abscisseC;
}
else
{
    setTimeout('img_monte(1,-100)',vitesse);
}
 
document.getElementById('imgb').style.backgroundPosition=''+ordonneeC+'px '+abscisseC+'px';
setTimeout('img_descente(1,0)',vitesse);
}
 
 
 
function img_monte(limit_atteinte,limith){
//alert('fonctionmonte');
var unePos = document.getElementById('imgb').style.backgroundPosition;
 
// Je coupe les coordonnées pour obtenir que les chiffres, ex : 0px -95px devient 0 -95
var elem = unePos.split(' ');
ordonnee = elem[0];
abscisse = elem[1];
 
var ordo = ordonnee.split('px');
ordonneeC = ordo[0];
 
var absc = abscisse.split('px');
abscisseC = absc[0];
 
ordonneeC = parseInt(ordonneeC);
abscisseC = parseInt(abscisseC);
 
//abscisseC= abscisseC+1;
//alert(abscisseC);
//ordonneeC= ordonneeC+1;
//alert(ordonneeC);
 
 
if (rebond_limit==limit_atteinte)
{
         abscisseC=abscisseC-2;
         newabs= abscisseC;
}
else
{
    //***montee d'1px***
    abscisseC= abscisseC-1;
    alert(abscisseC);
}
 
if(abscisseC>limith)
{
    newabs= abscisseC;
}
else
{
    setTimeout('img_descente(0,0)',vitesse);
}
 
document.getElementById('imgb').style.backgroundPosition=''+ordonneeC+'px '+abscisseC+'px';
//alert(document.getElementById('imgb').style.backgroundPosition);
 setTimeout('img_monte(1,-100)',vitesse);
}
 
</script>
 </head>
<body onload="load()">
 
<div id="imgb" style="position:absolute; width:300px; height:200px; background:url(file:///C|/wamp/www/Image/logocreatif1.png) no-repeat; background-position:0px 0px; border-style: solid ;">
</div>
 
</body>
</html>

Si une personne voit un peu près où je me plante.

Merci.

vermine · 13/04/2011, 13h42

Bonjour,

Lorsque vous faites ceci :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
if(abscisseC<limith)
{
    newabs= abscisseC;
}
else
{
    setTimeout('img_monte(1,-100)',vitesse);
}
 
document.getElementById('imgb').style.backgroundPosition=''+ordonneeC+'px '+abscisseC+'px';
setTimeout('img_descente(1,0)',vitesse);

Vous lancez deux timer quasi en même temps, chaqu'un appelant une fonction différente qui effectuent toutes deux un setTimeout.

LowTiste · 13/04/2011, 14h49

J'ai mis un break pour voir si ça marchait. Mais j'ai du mal à voir une autre solution...

vermine · 13/04/2011, 15h30

D'abord je commencerais par déclarer le timer en local :

Code :

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

1
2
 
var timer = setTimeout(...);

ou bien en global :

Code :

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

1
2
3
4
5
6
7
var timer;
 
...
{
    timer = setTimeout(...);
}
...

Ensuite je changerais la logique :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
if(abscisseC<limith)
{
    newabs= abscisseC;
    document.getElementById('imgb').style.backgroundPosition=''+ordonneeC+'px '+abscisseC+'px';
    setTimeout('img_descente(1,0)',vitesse);
}
else
{
    setTimeout('img_monte(1,-100)',vitesse);
}

Ou alors quitter la fonction :

Code :

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

1
2
3
4
5
6
7
8
 
...
else
{
    setTimeout(...);
    return;
}
...

13/04/2011, 14h49	#3
LowTiste Invité de passage Étudiant Inscription : mars 2011 Messages : 19 Détails du profil Informations personnelles : Sexe : Localisation : France Informations professionnelles : Activité : Étudiant Secteur : High Tech - Matériel informatique Informations forums : Inscription : mars 2011 Messages : 19 Points : 2 Points : 2	J'ai mis un break pour voir si ça marchait. Mais j'ai du mal à voir une autre solution...
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email