Afficher le nom d'une image sous l'image.

24 août 2009, 07:23

Bonjour,

Avec le code qui suit, le script m'affiche 4 images (l'une à côté de l'autre sur la meme ligne, comme dans des <TD>) avec (au passage de la souris) le nom respectif de chaque image via un "alt".

/....suite du code
$albums = $mysql->select($sql);
if ($albums) {
    if (is_array($albums)) {
        for ($i = 0; $i < count($albums); $i++) {
            $thumb = GALERIE_PATH_1 . '/getimg.php?cat=' . $albums[$i]['image_chemin'];
            echo "\n" . '<span class="env3"><a href="' . '/photo/?alb=' . $albums[$i]['categorie_id'], '">';
            echo '<img border="0" title="' . htmlentities($albums[$i]['categorie_nom']) . '" src="' . $thumb
                . '" alt="' . htmlentities($albums[$i]['categorie_nom']) . '" />';
            echo '</a></span>';

        }
    } else {
        echo 'Aucun album disponible.';
    }
} else {
    echo 'erreur SQL :<br />' . mysql_error();
}

$mysql->fermer();

J'arrive à réccuperer le nom de chaque image avec un: echo ' ' . htmlentities($albums[$i]['categorie_nom']) . ' ';

Ma quéstion est : comment faire pour afficher le Nom de chaque image sous l'image elle meme, et cela sans perturber l'affichage?

Merci pour votre aide.

24 août 2009, 09:16

Avec un petit

<br />

sous l'image ?

24 août 2009, 09:35

Salut,

Bonjour,
Avec le code qui suit, le script m'affiche 4 images (l'une à côté de l'autre sur la meme ligne, comme dans des <TD>) avec (au passage de la souris) le nom respectif de chaque image via un "alt".
[...]
J'arrive à réccuperer le nom de chaque image avec un: echo ' ' . htmlentities($albums[$i]['categorie_nom']) . ' ';
Ma quéstion est : comment faire pour afficher le Nom de chaque image sous l'image elle meme, et cela sans perturber l'affichage?
Merci pour votre aide.

Pour ce qui est mise en page : CSS

Tu mets ton image et ton titre dans un container ce qui peut s'écrire ainsi:

Code : Tout sélectionner

--- css

#container { ... }
.containerImage { float:left; width:50px; height:70px; }
.image { width: 50px; height:50px; }
.title { height:20px; }

--- html

<div id="container">
   <div class="image">
      <img src="image.png" alt="titre" />
      <span class="title">
         Le titre
      </span>
   </div>
</div>

Le css, employé ainsi, est "pas finalisé" à toi de le faire

Les ID sont marqués .
Les CLASS sont marquées #

Le float permet de sortir l'élément de son context et de la placer à gauche.
Width & Height sont les dimensions
div est de type block donc ce qui suit va à la ligne (du container parent)
span est un élément dit en ligne

http://forum.alsacreations.com

@+ et bonne lecture

EDIT: Fermeture d'un div oublié

Afficher le nom d'une image sous l'image.

Qui est en ligne