Div hidden / visible & Images ne s'affichant pas

finipe-
Invité n'ayant pas de compte PHPfrance

26 août 2005, 00:46

Bonjour !

Je butte sur un insoluble problème et me décidé-je donc à venir demander de l'aide.

Je fais une galerie d'images à base de php/mysql, tout fonctionne très bien : créations de miniatures, mise en page en tableau, etc, tout va bien. Seulement je voudrais que l'agrandissement apparaisse grâce à un cadre que j'ai donc défini comme ceci (avec le CSS qui va bien, position:absolute, visibility:hidden, etc) :

Code : Tout sélectionner

<div id='galerie_grand'></div>
Puis, un lien sur chq miniature renvoie au javascript suivant :

Code : Tout sélectionner

function ferme_Galerie() { document.getElementById('galerie_grand').style.visibility = "hidden"; } function Galerie(filename,commentaire) { var debut1 = "<table><tr><td><b>- Galerie -</b></td><td'>"; var debut2 = "<img src='images/fermer.gif' border='0' onClick='javascript:ferme_Galerie();'>"; var debut3 = "</td></tr><tr><td colspan='2'>"; var milieu1 = "<center><img src='galerie/" + filename; var milieu2 = "'><br><br>" + commentaire; var fin = "</center></td></tr></table>"; var img_close = new Image(); img_close.src = 'images/fermer.gif' // charge l'image fermer.gif var img = new Image(); img.src = 'galerie/' + filename // charge l'image agrandie de la galerie document.getElementById('galerie_grand').innerHTML = debut1+debut2+debut3+milieu1+milieu2+fin; document.getElementById('galerie_grand').style.top = document.body.scrollTop + 20; document.getElementById('galerie_grand').style.left = 20; document.getElementById('galerie_grand').style.visibility = "visible"; }
Tout fonctionne à merveille : le cadre s'affiche parfaitement, la mise en pag est bonne, les dimensions aussi, SAUF QUE, les images ne s'affichent pas : il faut que je fasse un clic droit puis "Afficher l'image" pour que celles-ci daignent apparaître.

J'ai vérifié dans les fichiers temporaire, mes images fermer.gif et l'image agrandie sont bien présentes dans le cache. Alors pourquoi ne veulent-elle pas s'afficher ?

Dernière précision : une fois que j'ai fait clic droit + Afficher l'image, alors quand je réagrandis à partir de la miniature, cette fois-ci l'image apparaît correctement.

Voilà, je crois que j'ai donné autant de détails que possible, j'attends maintenant une âme généreuse pour me tirer de ce mauvais pas :)

PS : je suppose que mon code javascript n'est pas un modèle d'optimisation, j'ai tout appris tout seul

Eléphant du PHP | 337 Messages

28 août 2005, 23:02

Personne n'a une petite idée ? :?

Mammouth du PHP | 19672 Messages

29 août 2005, 09:00

Avec quel navigateur as-tu essayé ?
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 337 Messages

29 août 2005, 13:45

Pour l'instant je n'ai essayé qu'avec IE 6

Eléphant du PHP | 337 Messages

31 août 2005, 00:25

J'ai essayé en utilisant un script tout fait que j'ai trouvé en téléchargement, qui fait peu ou prou la même chose que le mien, mais avec un dragmouse en plus. Sur le site d'exemple, il fonctionne parfaitement. Une fois transposé sur mon site, ça me refait la même chose, c'est à en devenir dingue :lol:

Le site en question est hébergé chez free, mais vraiment, je me demande bien pourquoi ça viendrait de là :?

Une suggestion ?

Mammouth du PHP | 19672 Messages

31 août 2005, 08:11

C'est un problème de navigateur à mon avis, un défaut dans une mise à jour peut-être :?
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 337 Messages

31 août 2005, 12:45

Il me semble que non : j'ai une version récente d'IE, et puis surtout j'ai vu ce script fonctionner parfaitement sur un autre site. Une fois tranposé dans mon cas, paf, ça ne marche plus (j'ai revérifié de nouveau, les images sont pourtant bien présentes dans le cache).

Serait-il possible que qqun fasse un copier/coller de ce code et l'essaye chez lui pour voir si ça vient de chez moi ?

Eléphant du PHP | 337 Messages

03 sept. 2005, 16:28

Je remonte une dernière petite fois ce sujet, je n'ai toujours pas trouvé d'où venait le problème :?

Eléphant du PHP | 337 Messages

25 oct. 2005, 12:15

Hop, juste un message pour signaler que j'ai découvert les circonstances de l'erreur (mais toujours pas le pourquoi, le mystère demeure entier) :

Dans le premier script, tout le code html correspondant à ma mise en page de cadre était codé à l'intérieur du javascript, puis les différents éléments chaîne de caractère ainsi obtenus étaient concaténés, comme ceci :
function Galerie(filename,commentaire) 
{ 
   var debut1  = "<table><tr><td><b>- Galerie -</b></td><td'>"; 
   var debut2  = "<img src='images/fermer.gif' border='0' onClick='javascript:ferme_Galerie();'>"; 
   var debut3  = "</td></tr><tr><td colspan='2'>"; 
   var milieu1 = "<center><img src='galerie/" + filename; 
   var milieu2 = "'><br><br>" + commentaire; 
   var fin     = "</center></td></tr></table>"; 

   document.getElementById('galerie_grand').innerHTML = debut1+debut2+debut3+milieu1+milieu2+fin; 
   document.getElementById('galerie_grand').style.top = document.body.scrollTop + 20; 
   document.getElementById('galerie_grand').style.left = 20; 
   document.getElementById('galerie_grand').style.visibility = "visible"; 
}
De la sorte, l'image était chargée dans le cache, mais n'apparaissait pas à l'écran, il fallait faire clic droit -> Afficher l'image pour qu'elle daigne se montrer.



Si par contre je place ce code en début de page :
<table>
    <tr>
        <td><b>- Galerie -</b></td>
        <td><img src='images/fermer.gif' border='0' onClick='javascript:ferme_Galerie();'></td>
    </tr>
    <tr>
        <td colspan='2'>
            <center><div id='img'></div</center>
        </td>
    </tr>
</table>
...et que je place l'image avec innerHTML dans le <div id='img'> alors là l'image s'affiche correctement. et tout fonctionne.

Problème résolu, mais pas compris :lol: