Bonjour à tous,
J'ai consulté plusieurs messages ayant été postés précédemment concernant les problèmes d'affichage de la galerie de photos en javascript. Or, je n'ai pas été en mesure de trouver une solution à mon problème.
Voilà; le script fonctionne à merveille lorsque je suis en local. Cependant, dès que je clique sur les miniatures autant dans Firefox que dans Internet Explorer, mon image s'affiche sur une page blanche, même si tout fonctionnait très bien en local.
Voici les parties pertinentes de mon xHTML;
Voici mon javascript;
Tout est identique au tutoriel pour ce qui est du CSS et la petite ligne de javascript présente entre les balises <head> de mon fichier HTML.
Pourriez-vous m'indiquer ce que vous croyez qui cloche?
Merci infiniment pour votre temps.
[/i][/i][/i]
Modifié par Isabelle44 (12 May 2007 - 22:01)
J'ai consulté plusieurs messages ayant été postés précédemment concernant les problèmes d'affichage de la galerie de photos en javascript. Or, je n'ai pas été en mesure de trouver une solution à mon problème.
Voilà; le script fonctionne à merveille lorsque je suis en local. Cependant, dès que je clique sur les miniatures autant dans Firefox que dans Internet Explorer, mon image s'affiche sur une page blanche, même si tout fonctionnait très bien en local.
Voici les parties pertinentes de mon xHTML;
<div id="galerie" class="galerie">
<ul id="galerie_mini">
<li><a href="psp1.jpg" title="Avenue au Pub St-Paul"><img src="m_psp1.jpg" alt="Avenue au Pub St-Paul" /></a></li>
<li><a href="psp2.jpg" title="Bruno à la guitare"><img src="m_psp2.jpg" alt="Bruno à la guitare" /></a></li>
<li><a href="psp3.jpg" title="Louis-Philippe à la voix"><img src="m_psp3.jpg" alt="Louis-Philippe à la voix" /></a></li>
<li><a href="psp4.jpg" title="Jean-Thomas à la basse"><img src="m_psp4.jpg" alt="Jean-Thomas à la basse" /></a></li>
<li><a href="psp5.jpg" title="Guillame à la batterie"><img src="m_psp5.jpg" alt="Guillaume à la batterie" /></a></li>
<li><a href="psp6.jpg" title="Bruno et Jean-Thomas"><img src="m_psp6.jpg" alt="Bruno et Jean-Thomas" /></a></li>
<li><a href="psp7.jpg" title="Avenue"><img src="m_psp7.jpg" alt="Avenue" /></a></li>
<li><a href="psp8.jpg" title="Le band relaxe..."><img src="m_psp8.jpg" alt="Le band relaxe..." /></a></li>
<li><a href="psp9.jpg" title="Louis-Philippe, Guillaume et le chanteur des Jolly Jumpers"><img src="m_psp9.jpg" alt="Louis-Philippe, Guillaume et le chanteur des Jolly Jumpers" /></a></li>
</ul>
<dl id="photo">
<dt>Avenue au Pub St-Paul</dt>
<dd><img id="big_pict" src="psp1.jpg" alt="Avenue au Pub St-Paul" /></dd>
</dl>
</div>Voici mon javascript;
function displayPics()
{
var liens = document.getElementsByTagName('a') ;
// Une boucle parcourant l'ensemble des liens d'une galerie
for (var i = 0 ; i < liens.length ; ++i) {
if(liens[i].parentNode.parentNode.parentNode&&liens[i].parentNode.parentNode.parentNode.className=="galerie"){
liens[i].onclick = function() {
var galerieEnCours =this.parentNode.parentNode.parentNode
var big_photo= galerieEnCours.getElementsByTagName('DD')[0].getElementsByTagName('IMG')[0]
var titre_photo = galerieEnCours.getElementsByTagName('dt')[0] ;
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;
/* for Mozilla */
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", displayPics, false);
}
else{
var _timer = setInterval(function() {
if(/loaded|complete/.test(document.readyState)){
// kill the timer
if (_timer) {clearInterval(_timer); _timer = null;}
displayPics();}}, 10);
}Tout est identique au tutoriel pour ce qui est du CSS et la petite ligne de javascript présente entre les balises <head> de mon fichier HTML.
Pourriez-vous m'indiquer ce que vous croyez qui cloche?
Merci infiniment pour votre temps.
[/i][/i][/i] Modifié par Isabelle44 (12 May 2007 - 22:01)
