diaporama image et souris active
bonjour à tou(te)s
je souhaite réaliser un diaporama :
1- Les images défilent automatiquement
2- La souris arrête l image dès q u elle la survol
3-Le diaporama continue là où il s'est arrêté dès que la souris se retire du diaporama
4- Et qu'au click souris sur l image, on passe à l image suivante
pour le moment j ai ce script
entre balise head:
Code:
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
| <script type="text/javascript">
var promos = new Array();
promos[0]='essai_img/img01.jpg';
promos[1]='essai_img/img02.jpg';
promos[2]='essai_img/img03.jpg';
promos[3]='essai_img/img04.jpg';
/*..............ect*/
function diaporama(id, liste, numero)
{
document.getElementById(id).src = liste[numero];
numero++;
if (numero == liste.length)
{
numero = 0;
}
timer = window.setTimeout(function() { diaporama(id, liste, numero); },
2000);
}
function stop(id)
{
window.clearTimeout(timer);
document.getElementById(id).src = promos[3];
}
</script> |
entre balise body:
Code:
1
2
3
4
5
6
7
| <div id="diapopromo">
<div id="promau">
<img name='lui' id='lui' width='420' height='275' src='essai_img/img01.jpg' onmouseout="diaporama('lui', promos, 0);
" onmouseover="stop('lui');" alt='AAAA' />
</div>
</div> |
Problèmes :
1-lorsque souris survol, l image qui s'affiche est promos[3];/ cad toujours la même.
2- quand on click dessus on reviens au point de départ promos, 0);!!!!
3- diapo ne s'active pas automatiquement
Peut on m indiquer ce que je dois changer au niveau de ce script ou me donner référence d'un tuto pour réaliser un diaporama avec ces objectifs
merci à vous
ama
diaporama et souris active suite
bonsoir
j a i maintenant un nouveau script qui me permet de faire démarrer /certes/ le diaporama en automat., seulement je ne sais toujours pas comment l'arrêter au survol de la souris, ni comment pouvoir le faire continuer quand la souris ne survol plus le diaporama.
quelqu'un peut il m aider ?
Et est-ce possible toutes ces manipulations ( voir le mss d avant)car là je ne trouve toujours pas!! merci
voici le nouvo script:
Code:
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="style_index/essai02_left.css" type="text/css" media="screen" />
<title>test3</title>
<SCRIPT LANGUAGE="JavaScript">
<!--
var timeDelay = 2;
var Pix = new Array
("essai_img/img01.jpg"
,"essai_img/img02.jpg"
,"essai_img/img03.jpg"
,"essai_img/img04.jpg");
var howMany = Pix.length;
timeDelay *= 1000;
var PicCurrentNum = 0;
var PicCurrent = new Image();
PicCurrent.src = Pix[PicCurrentNum];
function startPix() {
setInterval("slideshow()", timeDelay);
}
function slideshow() {
PicCurrentNum++;
if (PicCurrentNum == howMany) {
PicCurrentNum = 0;
}
PicCurrent.src = Pix[PicCurrentNum];
document["ChangingPix"].src = PicCurrent.src;
}
// End -->
</script>
<body OnLoad="startPix()">
<img name="ChangingPix" src="essai_img/img01.jpg" >
</body>
</html> |
