Bonjour,

J'ai crée un code JavaScript qui me permet de faire bouger une image en jouant avec le backgroundPosition. J'ai donc fait deux fonctions, une qui bouge l'image vers le haut, l'autre vers le bas. Exemple, l'image monte, une fois arrivée en haut, on appelle dans le else l'autre fonction qui l'a fait descendre. Pour tester, je met des alert, cela marche très bien, mais une fois mes alert retirés, je relance mon code. Rien ne se passe.. Est ce qu'il serait possible que quelqu'un m'éclaire ? Voici mon code pour plus de précision :

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
128
129
130
131
132
 <html>
<head>
 <title></title>
<script type="text/javascript">
    var rebond1= 0;
    var rebond0= 1;
    var rebond_limit=2;
    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 = 20;//vitesse du mouvement : vous pouvez changer cette valeur
function load()
{//alert('focntion 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);
    setTimeout(img_monte(1,-100),1000);
    //alert ('img_monte');
}
 
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];
 
abscisseC = parseInt(abscisseC);
ordonneeC = parseInt(ordonneeC);
 
//abscisseC= abscisseC+1;
//alert(abscisseC);
//ordonneeC= ordonneeC+1;
//alert(ordonneeC);
 
if (rebond_limit==limit_atteinte)
{//alert(limit_atteinte);
         abscisseC=abscisseC+2;
         newabs= abscisseC;
}
else
{
    //***montee d'1px***
    abscisseC= abscisseC+1;
}
//alert(abscisseC);
//alert(limith);
if(abscisseC<limith)
{
    newabs= abscisseC;
    //alert(abscisseC);
}
else
{
    //alert('rebondb');
    img_monte(0,-100);
 
}
 
document.getElementById('imgb').style.backgroundPosition=''+ordonneeC+'px '+abscisseC+'px';
//alert(document.getElementById('imgb').style.backgroundPosition);
setTimeout(img_descente(1,0),100);
}
 
 
 
function img_monte(limit_atteinte,limith){
//alert('fonctionmonte');
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];
 
abscisseC = parseInt(abscisseC);
ordonneeC = parseInt(ordonneeC);
 
//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;
}
 
if(abscisseC>limith)
{
    newabs= abscisseC;
}
else
{
    //alert('rebond');
    img_descente(0,0);
 
}
 
document.getElementById('imgb').style.backgroundPosition=''+ordonneeC+'px '+abscisseC+'px';
//alert(document.getElementById('imgb').style.backgroundPosition);
 setTimeout(img_monte(1,-100),100);
}
 
</script>
 </head>
<body onload="img_monte(1, -100)">
 
<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>
Merci.

Cordialement, LowTiste.