La fonction displayPics() installe des évènements (onclick) sur les images miniatures disposées dans la liste non ordonnée (ul unordered list en vo) repérée par l'identifiant (id) égal à
galerie_mini. Ces évènements chargent les images non réduites et leurs titres dans les deux lignes (dt et dd) du container (id) nommé
photo.
S'il s'agit seulement d'afficher les images d'une autre galerie de miniatures dans le même container, il suffit d'ajouter un argument (laGalerie qui est maintenant une variable et non plus une chaîne de caractère) à la fonction pour désigner la galerie à traiter.
Code Javascript :
function displayPics(laGalerie){
var photos = document.getElementById(laGalerie);
// On récupère l'élément ayant pour id laGalerie
// ... le reste sans changement
}Il conviendra alors, après chargement de la page (*) de lancer la fonction pour chacune des galeries (nommées par exemple 'galerie_mini_1' et 'galerie_mini_2')
Code Javascript :
displayPics('galerie_mini_1');
displayPics('galerie_mini_2');
(*) Les galeries devant exister avant le lancement de ces fonctions ces deux dernières lignes de script devront être placées (entre deux balises de script) à la fin du body ou bien encore dans une fonction lancée, comme l'était displayPics, par un window.onload.
Enfin, si le container de destination devait être également dupliqué, il conviendrait de prévoir de manière analogue un second argument à la fonction pour désigner celui-ci. Ouf!