fonction "cache/décache" pour galerie
Bonjour à tous,
Je suis en train de réaliser une gallerie d'image, l'idée, vous la connaissez, c'est de mettre des petits thumbnails les uns à côté des autres en réduit, et, quand on clique dessus, qu'il apparaisse en grand.
j'ai donc un <table> avec mes vignettes et plus loin, une div de destinations des grand format.
Le souçis, c'est que quand je clique sur 1 photo, elle s'affiche. Puis quand je clique sur 1 autre photo, elle s'affiche sans que la première disparaisse...
embêtant hein?!
Ma fonction JS:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
| <script type="text/javascript">
//------------------
function Swap( div_){
var Obj = document.getElementById( div_);
if( Obj){
if( Obj.style.display=="")
Obj.style.display="none";
else
Obj.style.display="";
}
}
</script> |
mon code pour les vignettes:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<table>
<tr>
<td><a href="#Photo1" onclick="Swap('DIV_Photo1');">
<img src="images/photo1.png" width="140" id="gallerie">
</a></td>
<td><a href="#Photo2" onclick="Swap('DIV_Photo2');">
<img src="images/photo2.png" width="140" id="gallerie">
</a></td>
</tr>
</table> |
et enfin le code de la div de destination du grand format:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
|
<table>
<tr>
<td>
<div id="DIV_Photo1" style="display:none" >
<img src="images/photo1.png" width="100%"></div>
<div id="DIV_Photo2" style="display:none" >
<img src="images/photo2.png" width="100%"></div>
</td>
</tr>
</table> |
Vous pourriez m'aider? merci
