Bonjour!

Je vous écrit car j'ai très peu de connaissance en js et j'aurais besoin de votre aide...

Pour commencé, j'ai plusieurs div qui affiche une image lors du passage de la souris dont voici le code html :


Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
<div id="pommier">
<div class="pomme" roll="1"><a href=""></a></div>
<div class="pomme" roll="2"><a href=""></a></div>
<div class="pomme" roll="3"><a href=""></a></div>
<div class="pomme" roll="4"><a href=""></a></div>
</div>

et le 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
#pommier {
	width:766px;
	height:540px;
	background:url(img/pommier-bg.jpg) no-repeat;
}
 
 
#pommier .pomme {
	width:140px;
	height:350px;
	float:left;
	margin-top:140px;
	margin-left:10px;
}
 
 
 
#pommier .pomme a {
	display:block;
	width:140px;
	height:350px;
}
 
 
#pommier .pomme a:hover {
	display:block;
	background:url(img/pommier-rollover.png) no-repeat;
	width:140px;
	height:350px;
}


Maintenant j'aimerais que le rollover se déclenche un part un dans l'ordre :
roll="1" (1seconde puis revient a la normal), roll="2" (1seconde puis revient a la normal) ect

Je n'sai pas du tout par ou commencer, alors si quelqu'un a la gentillesse de me donner un coup de main, ce serait génial

Merci encore

(dsl des fautes d'orthographe ... )