Salut à tous, je rencontre un bon gros problème.
J'ai suivi un tuto pour créer une galerie d'images en java seul souci, bah les images s'ouvrent sur une page vierge, donc ca ne fonctionne pas.
j'ai fait un fichier html nommé 'index'
Code :
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head><script type="text/javascript" src="script.js"></script>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>Document sans nom</title>
- </head>
- <body>
- <div id="galerie">
- <ul id="galerie_mini">
- <li>
- <a href="images/photo1.jpg" title="Titre de la photo 1"><img src="images/minis/m_photo1.jpg" alt="Le titre de la photo 1" width="70" /></a> </li>
- <li>
- <a href="images/photo2.jpg" title="Titre de la photo 2"><img src="images/minis/m_photo2.jpg" alt="Le titre de la photo 2" width="70" /></a> </li>
- <li>
- <a href="images/photo3.jpg" title="Titre de la photo 3"><img src="images/minis/m_photo3.jpg" alt="Le titre de la photo 3" width="70" /></a> </li>
- <li>
- <a href="images/photo4.jpg" title="Titre de la photo 4"><img src="images/minis/m_photo4.jpg" alt="Le titre de la photo 4" width="70" /></a> </li>
- <li>
- <a href="images/photo5.jpg" title="Titre de la photo 5"><img src="images/minis/m_photo5.jpg" alt="Le titre de la photo 5" width="70" /></a> </li>
- <li>
- <a href="images/photo6.jpg" title="Titre de la photo 6"><img src="images/minis/m_photo6.jpg" alt="Le titre de la photo 6" width="70" /></a> </li>
- <li>
- <a href="images/photo7.jpg" title="Titre de la photo 7"><img src="images/minis/m_photo7.jpg" alt="Le titre de la photo 7" width="70" /></a></li>
- </ul>
- <dl id="photo">
- <dt>Titre de la photo 1</dt>
- <dd><img id="big_pict" src="images/photo1.jpg" alt="Photo 1 en taille normale" /></dd>
- </dl>
- </div>
- </body>
- </html>
|
Et un fichier nommé 'script.js'
Code :
- // JavaScript Documentfunction displayPics()
- {
- var photos = document.getElementById('galerie_mini') ;
- // On récupère l'élément ayant pour id galerie_mini
- var liens = photos.getElementsByTagName('a') ;
- // On récupère dans une variable tous les liens contenu dans galerie_mini
- var big_photo = document.getElementById('big_pict') ;
- // Ici c'est l'élément ayant pour id big_pict qui est récupéré, c'est notre photo en taille normale
- var titre_photo = document.getElementById('photo').getElementsByTagName('dt')[0] ;
- // Et enfin le titre de la photo de taille normale
- // Une boucle parcourant l'ensemble des liens contenu dans galerie_mini
- for (var i = 0 ; i < liens.length ; ++i) {
- // Au clique sur ces liens
- liens[i].onclick = function() {
- big_photo.src = this.href; // On change l'attribut src de l'image en le remplaçant par la valeur du lien
- big_photo.alt = this.title; // On change son titre
- titre_photo.firstChild.nodeValue = this.title; // On change le texte de titre de la photo
- return false; // Et pour finir on inhibe l'action réelle du lien
- };
- }
- }
- // Il ne reste plus qu'à appeler notre fonction au chargement de la page
- window.onload = displayPics;
|
Mais rien y fait ca ne fonctionne pas, meme en copie collant vulgairement le code comme ci dessus.
Bref si quelqu'un peut m'aider je le remercie d'avance ^^