Javascript+image aléatoire

Résolu/Fermé
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 - 8 mai 2010 à 22:01
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 - 12 mai 2010 à 15:54
Bonjour

Dans un script PHP, je dispose d'un tableau de chaînes de caractères contenant les chemins de toutes mes images.
Actuellement, sur la page principale de mon site local, j'affiche une image aléatoire à chaque chargement de la page à l'aide d'un script PHP.
J'aimerai, à la place, un script qui change l'image aléatoire toutes les x secondes, sans si possible charger la page entièrement.
Le PHP ne sachant pas faire ça, je me tourne vers le Javascript mais ce langage est un mystère pour moi.
Quelqu'un aurait-il, svp, un script javascript pouvant afficher une image aléatoire toutes les x secondes à partir d'une liste d'images contenu dans une variable PHP ?

Merci d'avance.


A voir également:

25 réponses

adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
12 mai 2010 à 08:33
Woow balaise le code xD

je sais pas comment tu t'y prend..

tu aurais un url de test ?

voila un code qui fonctionne (meme avec des image sans extensions) ;)

<?php
$arr = array();
$dirname = './smiley/';
$dir = opendir($dirname); 

while($file = readdir($dir)) {
	if($file != '.' && $file != '..' && !is_dir($dirname.$file))
	{
		echo '<a href="'.$dirname.$file.'">'.$file.'</a>';
                $arr[] = $dirname.$file;
	}
}

closedir($dir);


//$arr  = array ("el.png","hl.png","ajax.gif");
function php2js( $php_array, $js_array_name ) {
	// contrôle des parametres d'entrée
	if( !is_array( $php_array ) ) {
		trigger_error( "php2js() => 'array' attendu en parametre 1, '".gettype($array)."' fourni !?!");
		return false;
	}
	if( !is_string( $js_array_name ) ) {
		trigger_error( "php2js() => 'string' attendu en parametre 2, '".gettype($array)."' fourni !?!");
		return false;
	}

	// Création du tableau en JS
	$script_js = "var $js_array_name = new Array();\n";
	
	// on rempli le tableau JS à partir des valeurs de son homologue PHP
	foreach( $php_array as $key => $value ) {
	
		// pouf, on tombe sur une dimension supplementaire
		if( is_array($value) ) {
			// On va demander la création d'un tableau JS temporaire
			$temp = uniqid('temp_'); // on lui choisi un nom bien barbare
			$t = php2js( $value, $temp ); // et on creer le script JS
			// En cas d'erreur, remonter l'info aux récursions supérieures
			if( $t===false ) return false;

			// Ajout du script de création du tableau JS temporaire
			$script_js.= $t;
			// puis on applique ce tableau temporaire à celui en cours de construction
			$script_js.= "{$js_array_name}['{$key}'] = {$temp};\n";
		}
		
		// Si la clef est un entier, pas de guillemets
		elseif( is_int($key) )  $script_js.= "{$js_array_name}[{$key}] = '{$value}';\n";
		
		// sinon avec les guillemets
		else $script_js.= "{$js_array_name}['{$key}'] = '{$value}';\n";
	}

	// Et retourn le script JS
	return $script_js;
}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script>

<?php echo php2js($arr, 'tabImg'); ?>
var temps = 2000;

function changeImage(){
num = Math.floor(Math.random() * tabImg.length-1)+1;

document.getElementById("img").src=tabImg[num];
setTimeout("changeImage()",temps);
}

</script>
</head>

<body onload="changeImage();">

<p class="titre">


</p>

...
<img src="images/imagesParDefaut.png" id="img">
...
</body>
</html>



Adns
0
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 1 691
12 mai 2010 à 08:59
Je code comme cela me vient... j'avoue que mes scripts sont souvent lourds.
Je vais essayé de remplacer mon script par le tiens car il a un double avantage.

1) Il va sans doute permettre de faire ce que je recherche.

2) Il va alléger mon script et le rendre peut-être plus rapide.
0
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 1 691
12 mai 2010 à 11:28
J'ai modifié ton script pour récupérer les images parce qu'il récupère également les fichiers à la racine, ce que je ne veux pas...

$liste_repertoire_total = array();
	$liste_image_total = array();
	$rep_racine = './';
	$cle_rep_racine = opendir($rep_racine);
	
	while($fichier = readdir($cle_rep_racine))
	{
		if(is_dir($fichier) && $fichier!='.' && $fichier!='..')
		{
			$liste_repertoire_total[]=$rep_racine.$fichier;
			$cle_rep = opendir($rep_racine.$fichier);
			
			while($fichier_rep = readdir($cle_rep))
			{
				if(!is_dir($fichier_rep) && $fichier_rep!='.' && $fichier_rep!='..' && $fichier_rep!='thumb.db')
					$liste_image_total[]=$rep_racine.$fichier."/".$fichier_rep;
			}
		}
	}

0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
12 mai 2010 à 11:42
Si ca marche n'oublie pas le statut "résolu" ;)

Adns
0
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 1 691
12 mai 2010 à 12:02
Non, toujours pas... j'ai le cadre en tout petit mais à priori, rien dedans.
J'ai pourtant entré ton code hormis la création de la liste qui est différente.

Ceci dit, tu as mis ce lien dans <img>, cette image doit-elle exister pour que cela fonctionne ?

images/imagesParDefaut.png
0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
12 mai 2010 à 12:07
images/imagesParDefaut.png n'est pas obligé d'exister mais il te faut vérifié que le script ce lance

as-tu une URL de test ?

Adns
0
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 1 691
12 mai 2010 à 13:17
Comment ça une URL de test ?... c'est un site local qui n'est pas destiné à aller sur Internet.
0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
12 mai 2010 à 13:43
Ah ok dommage..

si tu utilise IE es ce que celui si te donne une erreur de script ?
a l'endroit ou il y a ecrit terminé en bas a gauche y a t-il un petit triangle jaune ?

Si tu utilise firefox ouvre la console d'erreur vide la ouvre ta page et dis nous ce qu'il y a dedans ;)

Adns
0
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 1 691
12 mai 2010 à 13:53
J'utilise Firefox avec la barre developper.
Dans la console d'erreur, il y a deux erreurs:

1. missing ; before statement
http://127.0.0.1/Dark/collec.php                                          Ligne: 9222
tabImg[9210] = './mi3 Tom's car/001.jpg';


Une flèche verte pointe entre ' et . de la chaîne

2. changeImage is not defined
http://127.0.0.1/Dark/collec.php                                           Ligne 1
0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
12 mai 2010 à 14:52
en effet le ' de Tom's pose probleme...

evite les ' dans les noms de dossier

sinon vois du cote de stripslash en fonction php qui pourrai resoudre ton probleme..

Adns
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Neliel Messages postés 6146 Date d'inscription jeudi 9 juillet 2009 Statut Contributeur Dernière intervention 20 mars 2017 1 691
12 mai 2010 à 13:26
Il n'y a pas un moyen de vérifier si la liste PHP a été correctement retranscrit en JavaScript ?
0
adns Messages postés 1094 Date d'inscription vendredi 23 février 2007 Statut Membre Dernière intervention 27 mars 2012 153
12 mai 2010 à 13:44
Si il y a un moyen le code que je lui est donné contient des alert ;)

Mais si il ne les vois pas c'est que sont javascript plante a un moment ou a un autre ...

Adns
0