Modification d'un code JS pour un diaporama

Bonjour

Je viens vers vous car j'ai réussi à trouver un slideshow parfait pour ce que je veux faire (à savoir un slideshow permettant l'affichage d'images en aleatoire)... Mais il n'est pas totalement parfait car il me manque 2 des choses que je souhaite sur ce script à savoir :
- Au lieu de marquer un a un les liens de mes images a afficher je voudrais qu'il aille les piocher dans un dossier contenu sur mon site
- Je souhaiterais que les transitions soient en fondu

Voila le code que j'ai trouvé :

<script language="javascript">

/*
Random image slideshow- By Tyler Clarke (tyler@ihatecoffee.com)
For this script and more, visit  http://www.javascriptkit.com
 
*/

var delay=1000 //set delay in miliseconds
var curindex=0

var randomimages=new Array()

	randomimages[0]="1.jpg"
	randomimages[1]="5.jpg"
	randomimages[2]="2.jpg"
	randomimages[3]="4.jpg"
	randomimages[4]="3.jpg"
	randomimages[5]="6.jpg"

var preload=new Array()

for (n=0;n<randomimages.length;n++)
{
	preload[n]=new Image()
	preload[n].src=randomimages[n]
}

document.write('<img name="defaultimage" src="'+randomimages[Math.floor(Math.random()*(randomimages.length))]+'">')

function rotateimage()
{

if (curindex==(tempindex=Math.floor(Math.random()*(randomimages.length)))){
curindex=curindex==0? 1 : curindex-1
}
else
curindex=tempindex

	document.images.defaultimage.src=randomimages[curindex]
}

setInterval("rotateimage()",delay)

</script>

Merci d'avance

Bonjour,

ce que tu demandes c'est avoir le code pour avoir ce que tu veux, ou des indications pour te permettre de faire ce code ?

Si c'est la première solution, de ce que j'ai compris, ce n'est pas le style de la maison .

Sinon, pour te guider :
- concernant le fait d'aller piocher les images dans un répertoire, il va te falloir coupler ce code avec du PHP.
Tu vas devoir construire ton tableau Javascript en PHP, surement en bouclant sur ton répertoire. ( Utiliser un directoryiterator sera surement le plus approprié ).
Tu boucles sur tes fichiers, en ajoutant quelques conditions sur le nom ou l'extension et tu peux facilement construire ton tableau.

- Pour le fondu, ça risque d'être plus difficile, mais pas infaisable. Tu vas par contre devoir pas mal modifier le code existant. Je pense qu'il y a d'autres scripts tout prêts qui te feront ce que tu souhaites.

Bref si tu veux mettre la main à la pâte :
Ton script actuel modifie le src d'une image par défaut. Du coup tu n'as pas plusieurs images dans ton DOM mais une seule. Ce qui ne va pas pour un affichage en fondu.

Une solution simple, est de créer un conteneur autour de ton image, de la taille de ton image.
Tu affiches ton image, et lorsqu'elle est entièrement affichée, tu la mets en background de ton conteneur. Tu mets ensuite l'opacité de ton image à 0.
Au moment ou tu changes d'image, tu changes le src de ton image par défaut, et à nouveau, tu fais passer son opacité de 0 à 1 ( avec un setInterval ou en utilisant une librairie qui te le fait simplement avec un " .fade() " ). Et lorsque ton fade est finis, tu passes ton images en background du conteneur, et tu remets son opacité à 0.

C'est une technique simple pour les fondus. Pas la seule, tu peux aussi utiliser deux images posées l'une sur l'autre et jouer avec le z-index et l'opacité.

N.B :
Pour ce qui est de la modification de l'opacité de l'image, je te conseil personnellement d'utiliser une librairie JS telle que MooTools ou jQuery, et tu modifies la fonction rotateimage() afin que ce soit un fondu et non un simple remplacement de src d'une seule image.

Mais vraiment, je pense que tu vas ré-inventer la roue, et qu'il existe des plug-ins qui le font. Au pire tu auras à surcharger la fonction qui fait le random, mais ça sera plus simple que de devoir refaire toi même la gestion de l'opacité.

Merci a toi pour ta réponse,

En fait je suis vraiment très nul en javascript (disons le franchement je n'y connais absolument rien) donc je sais pas si c'est compliqué ou non, si ça prend du temps ou non donc oui, comme tu l'as pensé j'aurais souhaité que quelqu'un puisse me le modifier pour enfin pouvoir le faire fonctionner (mais vu que ce n'est pas le style de la maison je n'insiste pas).

Par contre tu indiquais qu'il existait déjà des plugins tout fait qui répondent a mes attentes, je serais curieux de les connaitre car j'ai cherché mais j'ai rien trouvé ou alors j'ai trouvé les plugins qui font l'un mais pas l'autre...

Help /O\