28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Voilà 2 jours que je bute sur ce problème :

J'ai une liste d'images, et je voudrais que en cliquant sur une images, un div qui est en visibility:hidden devienne visible et que le background url se charge de l'image en question.

J'ai donc procédé étape par étape.

ma fonction au départ était :

<SCRIPT LANGUAGE="JavaScript">
<!--
function PopupImage() { 
if (document.getElementById) { //IE5 ou Netscape 6
document.getElementById("dialog").style.visibility="visible";
document.getElementById("dialog").style.background="url(../images/tableaux.convar118.jpg) no-repeat";
}
if (document.layers) { //NS4.X seul
document.dialog.visibility="visible";
document.dialog.background="url(../images/tableaux.convar118.jpg) no-repeat";
}
} 
//-->
</SCRIPT>


Là, cela fonctionnait, avec cependant, tout le temps la même image.
J'ai donc refait ma fonction comme ceci :

<SCRIPT LANGUAGE="JavaScript">
<!--
function PopupImage(tabcour) { 
if (document.getElementById) { //IE5 ou Netscape 6
document.getElementById("dialog").style.visibility="visible";
document.getElementById("dialog").style.background="url(tabcour) no-repeat";
}
if (document.layers) { //NS4.X seul
document.dialog.visibility="visible";
document.dialog.background="url(tabcour) no-repeat";
}
} 
//-->
</SCRIPT>

et j'envoie le paramètre comme cela :

<A href="javascript [langue]opupImage('../images/tableaux/<?=$row_tab['picture'];?>')"><IMG src="pic/phpThumb.php?w=100&h=75&src=../images/tableaux/<?=$row_tab['picture'];?>" alt="Cliquer pour agrandir"> </A>

dans le href, il faut lire : suivi de P

Quand je survole l'image avec ma souris, je vois bien dans la barre d'état que tout est bon, pourtant au final, mon div devient bien visible, mais sans background.

Le lien pour le site :

http://www.blackael.be/tableaux.php?tabcat=1

Merci d'éclairer mes lanternes, je suis un peu perdu.

Kanab
Modifié par Kanab (15 Jun 2009 - 13:29)
Salut,

Ton probleme vient d'une mauvaise concatenation de ta chaine de caracteres en javascript.

Tu as en effet le code

document.getElementById("dialog").style.background="url(+tabcour) no-repeat";

Qui devrait etre remplace par

document.getElementById("dialog").style.background="url(" + tabcour + ") no-repeat";


Au passage, tu as aussi une erreur lors du lancement de ton script FLIR. Ca doit sans doute venir du fait que tu ne fournisses pas des string comme parametre.
Yep

Merci Laurent, et en plus merci pour le FLIR, j'étais passé à côté, en lançant le site d'un autre pc, je m'en suis aperçu.

Au moins, aujourd'hui aura été une journée constructive.

Encore merci et à +

Kanab