Insérez dans l'en-tête (entre <head> et </head>)
l'invocation du script partagé suivant :
<script type="text/javascript" src="../lib/js/displayImage.js"></script>
Invoquez dans l'URL d'une ancre la fonction
displayImage avec le protocole
javascript.
<a href="javascript:displayImage(liste_des_arguments)">texte du lien</a>
où liste_des_arguments est la liste des éléments suivants
séparés par des virgules :
URL_absolue_ou_relative_de_l_image
titre_de_l_image (texte HTML destiné à être inclus dans un en-tête de niveau 1 <h1></h1>)
légende_de_l_image (texte HTML destiné à être inclus dans un paragraphe <p></p>)
couleur_du_fond_de_page (par défaut #000000 [noir])
couleur_du_texte (par défaut #FFFFFF [blanc])
Chacun de ces éléments peut être vide, les éléments vides en queue de liste peuvent être omis.
Exemple :
le lien ci-dessous est contenu dans l'ancre suivante :
<a href="javascript:displayImage('homeparoi.jpg','La grotte de Lascaux','Salle des taureaux')">
La grotte de Lascaux (1)</a>
Cliquez sur le lien pour voir aparaître une nouvelle fenêtre contenant l'image, son titre et sa légende.
Un simple clic sur l'image détruira cette nouvelle fenêtre et vous ramenera à celle-ci.
Autre exemple :
<a href="javascript:displayImage('homeparoi.jpg','La grotte de Lascaux','<b><i>Salle des taureaux</i></b>', '#666666', '#EEEE55')">
La grotte de Lascaux (2)</a>
L'utilisation d'une page modèle permet une stylisation plus poussée qu'avec
la solution sans page. Il vous est en effet loisible d'adapter complétement
les éléments permanents de votre page. Il suffit de conserver le script de récupération
des paramètres.
<a href="pageImage.html?homeparoi.jpg&La grotte de Lascaux&Salle des taureaux">La grotte de Lascaux (3)</a>
){kind=link}
){kind=link}