Sujet Précédent Sujet Suivant

SOS Diaporama HTML aléatoire

Fermé
Magniola Forever - 30 août 2010 à 16:31
avion-f16 Messages postés 19249 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 15 juin 2024 - 30 août 2010 à 17:19
Bonjour ,
j' aimerais changer ce code pour que les images apparaissent en odre aléatoire :

<SCRIPT LANGUAGE="javascript">
<!--
var img1=new Image(60,60);img1.src="http://s3.e-monsite.com/2010/08/19/04/Photo-010.jpg";
var img2=new Image(60,60);img2.src="http://s3.e-monsite.com/2010/08/19/01/Photo-616.jpg";
var img3=new Image(60,60);img3.src="http://s3.e-monsite.com/2010/08/19/02/IMG_0835.jpg";
var img4=new Image(60,60);img4.src="http://s3.e-monsite.com/2010/08/23/06/IMG_2229.jpg";
var img5=new Image(60,60);img5.src="http://s3.e-monsite.com/2010/08/23/06/IMG_2250.jpg";
var img6=new Image(60,60);img6.src="http://s3.e-monsite.com/2010/08/23/06/IMG_2252.jpg";
var img7=new Image(60,60);img7.src="http://s3.e-monsite.com/2010/08/29/06/Photo-207.jpg";
var img8=new Image(60,60);img8.src="http://s3.e-monsite.com/2010/08/30/05/Photo-027.jpg";
var img9=new Image(60,60);img9.src="http://s3.e-monsite.com/2010/08/30/05/Photo-528.jpg";
var img10=new Image(60,60);img10.src="http://s3.e-monsite.com/2010/08/30/05/IMG_2286.jpg";
var img11=new Image(60,60);img11.src="http://s3.e-monsite.com/2010/08/30/05/IMG_2362.jpg";
var img12=new Image(60,60);img12.src="http://s3.e-monsite.com/2010/08/30/05/IMG_2422.jpg";
var img13=new Image(60,60);img13.src="http://s3.e-monsite.com/2010/08/30/05/IMG_2315.jpg ";

/* etc ...etc ... rajouter autant de lignes que d'images, (400,300) sont les dimensions des images en pixels, la hauteur puis la largeur, à définir.*/

Total =13; /*Nombres d'images, à définir*/

Temporisation = 1; /*Temporisation du diaporama en secondes, à définir.*/

/* Ne rien éditer sous cette ligne ...!

//////////////////////////////////////////////////////////////////
*/

Temps = Temporisation * 7000;
Flag = false;
//-->
</SCRIPT>

<!-- A coller entre les balises <body> et </body> -->

<CENTER><A HREF="#" OnmouseOver="Flag = true;" OnmouseOut="Flag = false;"><IMG SRC="hilfe.gif" WIDTH="275" HEIGHT="210" BORDER="0" NAME="Vue"></A></CENTER>
<SCRIPT LANGUAGE="javascript">
<!--
var IncremenTation = 1 ;
function Afficher(){
if (!document.images){
alert("Votre navigateur ne supporte pas un SCRIPT inclus dans cette page Web \nVous devriez en télécharger une version plus récente.");
return;
}
if (!Flag) {
document.images.Vue.src=eval("img"+IncremenTation+".src")}
if (IncremenTation < Total)
{
IncremenTation = IncremenTation + 1;
}
else
{
IncremenTation = 1;}
setTimeout("Afficher()",Temps);
}
Afficher();
//-->
</SCRIPT>


Merci

1 réponse

Réponse 1 / 1
avion-f16 Messages postés 19249 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 15 juin 2024 4 505
30 août 2010 à 17:19
Salut.

Place ce script dans un fichier externe :
function randOrd() {
	return (Math.round(Math.random())-0.5);
}

function Gallery(divId) {
	this.timeout = 1000;
	this.imagesList = null;
	this.currentIndex = 0;
	this.divId = divId;
	this.imgTag = document.createElement('img');
	
	document.getElementById(this.divId).appendChild(this.imgTag);
}

Gallery.prototype.setImages = function(imagesList) {
	this.imagesList = imagesList.sort(randOrd);
};

Gallery.prototype.start = function() {
	var cElem = this;
	setInterval(function() {
		cElem.changeImage();
	}, cElem.timeout);
};

Gallery.prototype.changeImage = function() {
	var url = this.imagesList[this.currentIndex];
	this.currentIndex++;
	
	if(this.currentIndex >= this.imagesList.length) {
		this.currentIndex = 0;
	}
	
	this.imgTag.src = url;
};

Là où tu veux voir les images :
<div id="image"></div>


Et à la fin de ton body :
<script type="text/javascript" src="fichierExterne.js"></script>
<script type="text/javascript">
var images = Array(
	'image1',
	'image2',
	'image3'
);

galerie = new Gallery('image');
galerie.setImages(images);
galerie.start();
</script>
0

Discussions similaires

Boucle sur la première diapositive d'une présentation
ND83 -
ndubau -

3 réponses
la balise <br> ou <br />
faamugol -
rwaness -

8 réponses
Une musique qui évoque le souvenir ?
fadilb -
Justbymeg -

5 réponses
<br> ou <br /> ou </br>
corentin.93 -
jessy006 -

11 réponses
tirage aléatoire sans doublon
missfraise02 -
sc -

14 réponses