Créer un diaporama html pour visionner vos photos
ou pour les publier sur le Web (VBS)
Publier une série de photos numériques ou d'images sur le Web, sans que la photo déborde de l'écran, et avec un passage facile d'une photo à l'autre ?
Pas plus de 2 secondes avec le petit vbScript présenté ci-dessous.
Comment ça marche ?
Le VBScript va créer une page html contenant
- une image (ou photo)
- des liens "précédent" et "suivant" permettant de passer d'une photo à la suivante
- et quelques lignes de javascript incluant la liste des fichiers images et gérant le passage d'une photo à l'autre.
La page html :
La page s'appelle diapos.html. On l'utilise avec en argument le numéro de la photo à visionner : diapos.html?5 va afficher la cinquième photo.
La page html contient un tableau javascript im contenant la liste des noms des fichiers image : im[5] renvoie le nom du fichier de la cinquième image (par exemple "zaza.jpg").
Pour afficher l'image correspondant au numéro passé en argument, le javascript executé à l'ouverture de la page va lire la chaine de caractères argument :
nume=document.location.search
A ce stade, nume contient "?5".
Puis le script va retirer le "?":
nume=1*nume.substring(1,nume.length)
Le nom du fichier peut alors être obtenu par im[nume].
Il suffit alors d'utiliser document.write pour inscrire dans la page html la balise <IMG> qui va permettre l'affichage de la photo sélectionnée :
document.write("<IMG SRC='"+im[nume]+"'></IMG>")
Même procédure pour les liens vers la photo précédente ou vers la suivante :
document.write("<A HREF='"diapos.html?"+(nume+1)+"'>suivant</A>")
Ne manquent plus que quelques raffinements pour faire en sorte que l'image ne déborde pas de l'écran, et pour gérer le comportement des liens "suivant" et "précédent" au début et à la fin de la liste des images.
Le fichier vbs
Son seul rôle est de faciliter la création de la page html, et notamment la saisie de la liste des fichiers image.
Après avoir demandé à l'utilisateur de saisir l'adresse du répertoire contenant les images :
nomrep=inputbox("nom du répertoire contenant les images ?")
...le vbs va balayer le répertoire et faire la liste des fichiers images qu'il contient, en prenant soin d'entourer chaque nom de fichier de guillemets :
txt=""""","
Set fs=CreateObject("Scripting.FileSystemObject")
Set rep=fs.getFolder(nomrep)
for each fich in rep.files
if right(fich.name,4)=".jpg" or right(fich.name,4)=".gif" or right(fich.name,4)=".bmp" then
txt=txt & """" & fich.name & ""","
end if
next
txt=txt & """"""
...une fois la liste établie, il suffit de créer un fichier texte nommé diapos.html (placé dans le répertoire contenant les images), puis d'y inscrire le contenu de la page html, balises html et javascript, y compris le tableau contenant les noms des fichiers image :
Set fichdiapo = fs.OpenTextFile(nomrep & "\" & "diapos.html", 2, True)
fichdiapo.WriteLine "<HTML>"
....
fichdiapo.WriteLine "<SCRIPT>document.write(""<IMG SRC='""+im[nume]+""'></IMG>"")</SCRIPT>"
fichdiapo.WriteLine "</BODY></HTML>"
fichdiapo.close
Notez l'utilisation de doubles guillemets quand on souhaite que WriteLine inscrive le signe guillemet.
Il suffit alors d'ouvrir le fichier diapos.html pour pouvoir examiner toutes les photos du répertoire. On peut même demander au vbs d'ouvrir le fichier html dès qu'il l'a créé :
Set sh = WScript.CreateObject("WScript.Shell")
sh.Run("iexplore " & nomrep & "\diapos.html")
Si on veut utiliser un tableau Excel pour élaborer la liste des fichiers images, définir leur ordre de défilement, ajouter des titres ou commentaires, on peut utiliser une version VBA de ce programme, cliquez ici.
Cliquez ici pour accéder au Script "cree_diaporama.vbs"
Cliquez ici pour accéder au texte du script
Cliquez ici pour accéder au Script zippé
Cliquez ici pour voir un exemple de diaporama html