On continue dans la lignée des trucs et bidules en JavaScript. Ce langage permet simplement d'ajouter de nouvelles fonctionnalités un peu kikoolol à mon blog.
Aujourd'hui nous allons afficher de manière aléatoire une image. Rien d'interactif encore, à chaque refresh l'image sera différente. JavaScript étant un langage exécuté du côté client, il lui est impossible de parcourir une arborescence de fichier, c'est pourquoi le code présenté ci-dessous est un poil moins élégant que le précedent.
On déclare dans un premier temps les variables que nous allons utiliser.
Cette variable désigne le nombre d'images que vous avez mis dans le dossier où se trouve vos images.
var totalvidz = 5;
var i = 0;
On créait une image. La déclaration de cet objet est surement erroné et le new Image() est probablement inutile. Cependant il n'a embêté personne donc je le laisse. Ce sera l'image que l'on affichera
var image = new Image(120,300);
On appelle une fonction par encore écrite !
ChangeImage();
On s'attaque enfin au cœur du sujet, l'écriture de ChangeImage().
function ChangeImage()
{
On déclare le tableau qui va stocker toutes les adresses des images.
var source = new Array();
On charge. Vous remarquerez que nos images doivent porter comme nom un numéro. Du genre "1.png". Les numéros doivent se suivre. C'est la seule façon un peu élégante que j'ai trouvé pour faire abstraction du fait que nous n'avons pas accès au répertoire.
for(k=1; k< totalvidz+1;k++)
{
Vous changerez l'url pour adapter le script à vos besoins ainsi que l'extension.
source.push("http://nobunaga.duc.free.fr/starkiller/pub/" + k + ".png");
}
Je ne vais pas réécrire cette partie que l'on retrouve dans le tutoriel précédent.
i = Math.floor((source.length)*Math.random();
image.src = source[i];
On affiche l'image.
document.write('<img src="'+image.src+'" border="0">');
}