Un diaporama

**gui8676** · 28/12/2007, 01h06

Bonjour,

Je dois realiser un diaporama pour une application, et j'ai decidé de la faire en javascript.
J'ai regarder ce qui était deja fait mais rien ne correspondait exactement avec ce que je désire faire donc j'essaie de faire mon propre script

Je veux recuperer les images a afficher a partir d'une BDD (nom de l'image), puis afficher au hasard une image differente a un intevalle de temps.

J'ai reussi a recuperer les donnees de la BDD et a choisir une image au hasard.?
Je rencontre un probleme pour repeter l'affichage a un intervalle de temps
J'ai essayé setInterval et setTimeout mais sans succes

Merci d'avacnce pour votre aide

Voici mon code:

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
<!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=iso-8859-1" />
<title>diap2</title>
<script>
function affiche(Pic)
{
    var random = Math.round((Math.random()*(Pic.length-1)))
    // Generation d'une valeur alétoire
    var nom = Pic[random]
    document.write("<img src=VersionLocale/"+nom+" />")
}
</script>
</head>
 
<body>
 
<script>
 
var Pic = new Array()
 
</script>
<?php
if (isset ($_POST['Diaporama']))
{
    $diap = $_POST['Diaporama'];
    echo $diap;
    mysql_connect("localhost","root","");
    mysql_select_db("narcisse");
    $id_photo = mysql_query("SELECT id_photo FROM `contient` WHERE `nom_diapo` = '$diap' ");
    mysql_close();
    $i = -1;
    while ($donnees = mysql_fetch_array($id_photo))
    {
        $i++;
        $id = $donnees['id_photo'];
        mysql_connect("localhost","root","");
        mysql_select_db("narcisse");
        $cliche = mysql_query("SELECT cliche FROM `photo` WHERE `id_photo` = '$id' ");
        mysql_close();
        while ($donnees2 = mysql_fetch_assoc($cliche))
        {
            $photo = $donnees2['cliche'];
        }
?>
        <script>Pic[<?php echo $i ?>] = '<?php echo $photo ?>' </script>
<?php
    }
}
else
{
    echo "pas de diap de selectioner";
}
?>
 
<script>
setInterval("affiche(Pic)",3000)
</script>
 
</body>
</html>

**d-Rek** · 28/12/2007, 10h46

Essaye ça :

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
<?php
// Mettre ce bout de code dans un petit fichier à inclure sur tes pages (centraliser les fonctions importantes/utiles)
/// config de la base de donnee
define('SQL_SERVER','localhost');
define('SQL_BDD','narcisse');
define('SQL_USER','root');
define('SQL_PASS','');
 
function connexion() {
	$db_link = @mysql_connect(SQL_SERVER,SQL_USER,SQL_PASS);
	mysql_select_db(SQL_BDD);
}
 
function close() {
	mysql_close();
}
?>
<!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=iso-8859-1" />
<title>diap2</title>
<script type="text/javascript">
var i=0;
function affiche(){
	var random = Math.round((Math.random()*(Pic.length-1)));
	// Generation d'une valeur alétoire
	var nom = Pic[random];
	var img=document.createElement('img');
	img.src='VersionLocale/'+nom;
	document.body.appendChild(img);
	setTimeout(function(){affiche();}, 3000);
}
</script>
</head>
<body>
<?php
if(isset ($_POST['Diaporama'])){
	$diap = $_POST['Diaporama'];
	echo $diap;
	connexion();
	$id_photo = mysql_query("SELECT id_photo FROM `contient` WHERE `nom_diapo` = '$diap' ");
	echo "<script>var Pic = new Array(";
	$i=0;
	while($donnees = mysql_fetch_array($id_photo)){
        $id = $donnees['id_photo'];
        $cliche = mysql_query("SELECT cliche FROM `photo` WHERE `id_photo` = '$id' ");
        while($donnees2 = mysql_fetch_assoc($cliche)){
            $photo = $donnees2['cliche']; // quand tu sors de ta boucle, $photo ne vaut qu'une valeur, la dernière ????!!!
        }
		if($i>0){echo ",";}
		echo "'".$photo."'";
		$i++;
    }
	echo ");</script>";
}else{
	echo "Aucun diapo sélectioné";
}
?>
<a onclick="affiche();" style="cursor:pointer;">TRY ME</a> (don't forget to check <img src="http://www.developpez.net/forums/images/buttons/resolu.gif"> on Developpez' forum community and perhaps to write a special thanks to d-Rek) <img src="http://www.developpez.net/forums/images/smilies/icon_biggrin.gif">
</body>
</html>

**gui8676** · 28/12/2007, 11h32

Merci de ta reponse d-Rek.

J'ai essayé le code, il est mieux que ce que j'avais reussi a faire.
Par contre, toutes les 3 secondes, il y a une nouvelle image qui est inséré sur la page. Et moi ce sue je veux c'est changer l'image.
Peut etre que je mettais mal expliquer dans mon précédent message
Je vais essayer de changer ca.

Encore merci pour ta reponse.

**SoBaKa** · 28/12/2007, 11h43

même chose que d-Rek à peu de chose près alors :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
var i=0;
function affiche(){
	var random = Math.round((Math.random()*(Pic.length-1)));
	// Generation d'une valeur alétoire
	var nom = Pic[random];
	var img=document.getElementById('diap');
	img.src='VersionLocale/'+nom;
	setTimeout(function(){affiche();}, 3000);
}
</script>

et dans ton code html tu dois avoir une balise :

Code :

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

<img id="diap" />

**SpaceFrog** · 28/12/2007, 11h54

prenant soin d'avoir fait un preload des images ...

**gui8676** · 28/12/2007, 12h59

Merci de vos reponse

Maintenant j'ai presque ce que je veux, c'est a dire qu'il y a bien le changement d'image mais j'aimerai que le diaporama demarre sans avoir besoin de clisuer sur un lien.

Si quelqu'un peut encore aider un débutant en javascript.

Encore merci et merci d'avance.