<a onmouseover="titre_rollover_<?php echo $pays; ?>.src='images/icone <?php echo $pays; ?> survole.jpg';" onmouseout="titre_rollover_<?php echo $pays; ?>.src='images/icone <?php echo $pays; ?>.jpg';">
<img src="images/icone <?php echo $pays; ?>.jpg" alt="<?php echo $pays; ?>" id="titre_rollover_<?php echo $pays; ?>" />
</a>
Ca marche parfaitement, mais je ne comprend pas comment d'après ce code attribuer tel image a tel pays, car ici java n'est nommé nul part dans le code....<?php
$head = <<<EOD
<title>Choisissez la galerie de votre choix</title>
EOD;
?>
<h1>Choisissez la galerie de photo que vous voulez voir</h1>
<?php
//On regarde les pays existants dans la bdd
$req = $bdd->query("SELECT DISTINCT gal_pays FROM galerie_photos");
while ($donnees = $req->fetch()) {
$pays = $donnees['gal_pays'];
?>
<a href="?p=galeriebdd&pays=<?php echo $pays; ?>&page=1" onmouseover="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>_over.jpg';" onmouseout="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>.jpg';">
<img src="images/titre_<?php echo $pays; ?>.jpg" alt="<?php echo $pays; ?>" id="titre_rollover_<?php echo $pays; ?>" />
</a>
<?php
}
Pour l'histoire du pays qui ne s'affiche pas, c'est normal, c'est php qui va le faire, avec la requête SQL il va chercher tous les pays qui existent dans ta bdd. <!--debut image -->
<div id="galerie_image">
<div id="galerie_image2">
<?php
echo $content;
?>
</div>
</div>
<!--fin image -->
Il faut jouer sur les tailles de chacune, galerie_image prend la plus grande taille. galerie_image2 prend la taille que tu veux, et tu la centre dans la première div
Code : Tout sélectionner
#galerie_image2 {
width: 500px;
margin: 0px auto 0px auto;
}
<?php
//On regarde les pays existants dans la bdd
$req = $bdd->query("SELECT DISTINCT gal_pays FROM galerie_photos");
while ($donnees = $req->fetch()) {
$pays = $donnees['gal_pays'];
?>
<a href="?p=galeriebdd&pays=<?php echo $pays; ?>&page=1" onmouseover="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>_over.jpg';" onmouseout="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>.jpg';">
<img src="images/titre_<?php echo $pays; ?>.jpg" alt="<?php echo $pays; ?>" id="titre_rollover_<?php echo $pays; ?>" />
</a>
<?php
}
Par ceci :
<?php
//Liste des pays avec rollover, à mettre dans l'ordre d'apparition
$liste_pays = array('france','usa','inde','australie','java','japon');
foreach ($liste_pays as $pays) {
?>
<a href="?p=galeriebdd&pays=<?php echo $pays; ?>&page=1" onmouseover="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>_over.jpg';" onmouseout="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>.jpg';">
<img src="images/titre_<?php echo $pays; ?>.jpg" alt="<?php echo $pays; ?>" id="titre_rollover_<?php echo $pays; ?>" />
</a>
<?php
}
Donc dans $liste_pays tu rentre tous les pays que tu veux, tu les rentre dans l'ordre d'apparition que tu voudras, donc la ce sera france en premier ensuite usa et après inde et ainsi de suite.<?php
echo "<p>\n";
while ($donnees = $req->fetch()) {
$photo = $donnees['gal_photo'];
$descr = $donnees['gal_descr'];
?>
<a href="<?php echo "$pays/grandes/$photo"; ?>" class="decal_img" rel="lightbox-cats" title="<?php echo $descr; ?>"><img src="<?php echo "$pays/petites/$photo"; ?>" alt="" /></a>
<?php
}
?>
</p>
Par ceci :
<table width="850">
<tr>
<?php
$n = 0; //Ne pas toucher !
while ($donnees = $req->fetch()) {
$photo = $donnees['gal_photo'];
$descr = $donnees['gal_descr'];
if ($n == 3) {
$n = 0;
?>
</tr>
<tr>
<td><a href="<?php echo "$pays/grandes/$photo"; ?>" class="decal_img" rel="lightbox-cats" title="<?php echo $descr; ?>"><img src="<?php echo "$pays/petites/$photo"; ?>" alt="" /></a></td>
<?php
} else {
?>
<td><a href="<?php echo "$pays/grandes/$photo"; ?>" class="decal_img" rel="lightbox-cats" title="<?php echo $descr; ?>"><img src="<?php echo "$pays/petites/$photo"; ?>" alt="" /></a></td>
<?php
}
$n++;
}
?>
</tr>
</table>
Ensuite on applique le css qui est actuellement sur ton site :
Code : Tout sélectionner
body {
margin: 0px auto 0px auto;
padding: 0px;
width: 1000px;
}
#debut_image {
padding: 0px;
width: 1000px;
text-align: center;
height: auto;
margin-top: 30px;
margin-bottom: 0px;
border-style: none;
}
#debut_image table {
text-align: center;
border: none;
color: #999;
margin-right: auto;
margin-left: auto;
}
<style type="text/css" media="screen">
<!--
body {
margin: 0px auto 0px auto;
padding: 0px;
width: 1000px;
}
#debut_image {
padding: 0px;
width: 1000px;
text-align: center;
height: auto;
margin-top: 30px;
margin-bottom: 0px;
border-style: none;
}
#debut_image table {
text-align: center;
border: none;
color: #999;
margin-right: auto;
margin-left: auto;
}
-->
</style>
<?php
//Liste des pays avec rollover, à mettre dans l'ordre d'apparition
$liste_pays = array('paris','usa','inde','australie','java','japon','cambodge','bali','venise','cuba');
foreach ($liste_pays as $pays) {
?>
<a href="?p=galeriebdd&pays=<?php echo $pays; ?>&page=1" onmouseover="titre_rollover_<?php echo $pays; ?>.src='images/icone_<?php echo $pays; ?>_survolee.jpg';" onmouseout="titre_rollover_<?php echo $pays; ?>.src='images/titre_<?php echo $pays; ?>.jpg';">
<img src="images/icone_<?php echo $pays; ?>.jpg" alt="<?php echo $pays; ?>" id="titre_rollover_<?php echo $pays; ?>" />
</a>
<?php
}<a href="?p=galeriebdd&pays=<?php echo $pays; ?>&page=1" onmouseover="titre_rollover_<?php echo $pays; ?>.src='images/icone_<?php echo $pays; ?>_survolee.jpg';" onmouseout="titre_rollover_<?php echo $pays; ?>.src='images/icone_<?php echo $pays; ?>.jpg';">
<img src="images/icone_<?php echo $pays; ?>.jpg" alt="<?php echo $pays; ?>" id="titre_rollover_<?php echo $pays; ?>" />
</a>