Discussion :

[dknafoweb]

Bonjour a tous , je dois créer un feux en js dont :

dans l'ordre suivant.

Le vert dois rester 3,5 secondes,

le jaune dois rester 1,5 seconde,

le rouge dois rester 4,5 seconde et dans la 1,5 seconde avant la fin, le jaune dois aussi s'allumer

et tout sa dans un boucle qui ne s'arrête pas ....

et ... sans photo

jais pas réussi a faire le rouge ensemble que le jaune , et je sais pas "mettre" en boucle

mon code : http://jsfiddle.net/39JU2/

on si voulais je le mais ici aussi :
html :

Code html :

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

1
2
3
4
5
6
7
<div id="wrap">
    <div id="main">
        <div class="round_green 3.5"></div>
        <div class="round_yellow 1.5"></div>
        <div class="round_red 4.5"></div>
    </div>
</div>

css :

Code css :

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
#wrap{
	position:relative;
}
#main {
	border:2px black solid;
	width:110px;
	height:320px;
}
.round_green{
	width:100px;
	height:100px;
	background:#6C6;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	-o-border-radius:100px;
	border-radius:100px;
}
.round_yellow{
	margin-top:100px;
	width:100px;
	height:100px;
	background:#F90;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	-o-border-radius:100px;
	border-radius:100px;
}
.round_red{
	margin-top:200px;
	width:100px;
	height:100px;
	background:#F00;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	-o-border-radius:100px;
	border-radius:100px;
}

js :

Code :

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

1
2
3
4
5
$(document).ready(function(){
	$('.round_green').show().delay(3500).hide(0);
	$('.round_yellow').hide().delay(3500).show(1).delay(1500).hide(0);
	$('.round_red').hide().delay(5000).show(1);
});

merci bcd a vous!!!!