Salut à vous, j'affiche dans une page web les images réduites dont les noms sont stockés dans une base de donnée et j'aimerais que lorsqu'on clique sur le lien de ces images, elles s'affichent avec leurs tailles normales sur la même page avec un fond transparent.
J'ai donc essayer d'utiliser le plugin lightbox http://leandrovieira.com/projects/jquery/lightbox/pour le faire mais le problème qui se pose c'est que seule la première image s'affiche comme je veux c'est à dire avec fond transparent, les autres images s'affichent mais sans fond transparent, vous pouvez le voir ici http://catalogue.joanescom.com. Aidez moi à faire en sorte que toutes les images puissent s'afficher en taille normale lorsqu'on clique dessus.
voici le code
Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82 <?php include("fonctions/fonctions.php"); connexion(); ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Bienvenu dans le Catalogue de Joanes Equipement !</title> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <script type="text/javascript"> $(document).ready(function() { $(function() { $('#gallery a').lightBox(); }); }); </script> <link rel="stylesheet" type="text/css" href="css/catalogue.css"></link> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /></link> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <?php // $NbrCol : le nombre de colonnes // $NbrLigne : calcul automatique a la FIN // ------------------------------------------------------- // (exemple) $NbrCol = 2; // La requete (exemple) : // toutes les "CHOSE" commençant par un "b", classées par ordre alphabétique. $query = "SELECT * FROM section ORDER BY nomsection"; $result = mysql_query($query); // ------------------------------------------------------- // nombre de cellules a remplir $NbreData = mysql_num_rows($result); // ------------------------------------------------------- // affichage $NbrLigne = 0; if ($NbreData != 0) { $j = 1; echo '<table border="0" cellspacing="20px" cellpadding="10px" width="700" style="position: absolute; left:50%; margin-left:-350px; height:auto; margin-top: 80px; ">'; echo '<tr>'; echo '<td colspan="4" height="100" class="titre">Catalogue Joanes Equipement</td>'; echo '</tr>'; while ($val = mysql_fetch_array($result)) { if ($j%$NbrCol == 1) { $NbrLigne++; echo "<tr>"; $fintr = 0; } echo '<td><div id="gallery">'; // ------------------------- // DONNEES A AFFICHER dans la cellule echo '<a href="img/sections/'.$val['img'].'"><img src="img/sections/'.$val['img'].'" width="70" style="border: 1px solid #CCCCCC;" title="Cliquez pour agrandir l\'image svp ! "></a>'; echo '</div></td>'; echo '<td>'; echo '<a href="categories.php?section='.$val['idsection'].'" style="font-size:12px;">'.$val['nomsection'].'</a>'; // ------------------------- echo '</td>'; if ($j%$NbrCol == 0) { echo "</tr>"; $fintr = 1; } $j++; } // derniere balise /tr if ($fintr!=1) { echo '</tr>'; } echo '<tr>'; echo '<td colspan="4" height="100" class="footer">Copyright © Joanes Sarl 2011</td>'; echo '</tr>'; echo '</table>'; } else { echo 'pas de données à afficher'; }?> <?php $connecte = connexion(); mysql_close($connecte); ?> </body> </html>
Partager