Bonjour,

J'ai créé une sorte de menu defilant qui affiche un certain nombre d'item et qui montre le suivant et cache le dernier quand on passe la souris sur la fleche du bas ou celle du haut.

Mais je n'arrive pas à faire continuer le defilement tant que la souris est sur la flêche du bas ou du haut et des qu'on retire la souris, le défilement s'arrête. Je sais qu'il y a surement une histoire de timeout mais je n'arrive pas à le mettre en place.

Voici le code du menu actuel :


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
 
<html>
<head>
<script type="text/javascript">
 
var iNbItem = 24;
var iStart = 1;
var iEnd = 5;
 
function seeMore ()
{
 
	if (iStart >= 1)
		document.getElementById ('item_haut').style.display = "block";
 
 
	if (iEnd >= iNbItem-1)
		document.getElementById ('item_bas').style.display = "none";	
 
 
	iEnd++;
	document.getElementById ('item_'+iEnd).style.display = "block";
	document.getElementById ('item_'+iStart).style.display = "none";
	iStart++;
 
 
}
 
function seeLess ()
{
 
	if (iStart == 2)
		document.getElementById ('item_haut').style.display = "none";
 
	if (iEnd == iNbItem)
		document.getElementById ('item_bas').style.display = "block";
 
	iStart--;
	document.getElementById ('item_'+iStart).style.display = "block";
	document.getElementById ('item_'+iEnd).style.display = "none";
	iEnd--;
 
}
 
</script>
</head>
 
<body>
<ul>
 
<li style="display:none;" id="item_haut"><a href="#" onclick="Javascript:seeLess();" onmouseOver="Javascript:seeLess();">Fleche vers le haut</a></li>
 
<li style="display:block;" id="item_1" >Item 1 </li>
<li style="display:block;" id="item_2" >Item 2 </li>
<li style="display:block;" id="item_3" >Item 3 </li>
<li style="display:block;" id="item_4" >Item 4 </li>
<li style="display:block;" id="item_5" >Item 5 </li>
<li style="display:none; " id="item_6" >Item 6 </li>
<li style="display:none; " id="item_7" >Item 7 </li>
<li style="display:none; " id="item_8" >Item 8 </li>
<li style="display:none; " id="item_9" >Item 9 </li>
<li style="display:none; " id="item_10">Item 10</li>
<li style="display:none; " id="item_11">Item 11</li>
<li style="display:none; " id="item_12">Item 12</li>
<li style="display:none; " id="item_13">Item 13</li>
<li style="display:none; " id="item_14">Item 14</li>
<li style="display:none; " id="item_15">Item 15</li>
<li style="display:none; " id="item_16">Item 16</li>
<li style="display:none; " id="item_17">Item 17</li>
<li style="display:none; " id="item_18">Item 18</li>
<li style="display:none; " id="item_19">Item 19</li>
<li style="display:none; " id="item_20">Item 20</li>
<li style="display:none; " id="item_21">Item 21</li>
<li style="display:none; " id="item_22">Item 22</li>
<li style="display:none; " id="item_23">Item 23</li>
<li style="display:none; " id="item_24">Item 24</li>
 
 
<li style="display:block;" id="item_bas"><a href="#" onClick="Javascript:seeMore();" onmouseOver="Javascript:seeMore();">Fleche vers le bas</a></li>
</ul>
 
</body>
</html>
Merci pour votre aide...