Aller au contenu

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


Sujets conseillés

Posté

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.

Posté

Je serais tenter de rajouter ."<br />".htmlentities($albums[$i]['categorie_nom']) avant le "</a>", mais ça a l'air si simple que je me demande si j'ai compris la question :unsure:

De plus un grand libellé pourrait aller sur plusieurs lignes et décaler...

Posté

Merci pour ta réponse, mais c'est la première des choses à quoi j'ai pensé. Le <br /> met effectivement le texte sous l'image, mais affiche egalement l'image suivante... ce qui donne à la fin, toutes les images une audessous de l'autre. Moi je veux garder les images sur la meme ligne.

Posté

Pour l'exemple, envoila un lien

Je pense qu'avec une classe CSS en <TR> et <TD>, je vais pouvoir separer le code sans ouvrir deux fois la base de donnée, non??

Posté

Holà tu mélanges un peu : soit c'est une mise en page en tableau (avec des TR TD etc), soit en CSS, mais les deux ne sont pas liés.

Le code que tu m'indiques n'est pas celui de ton exemple ?

Le mieux étant de mettre chaque image dans un DIV avec des dimensions précises, en flottant pour les avoir les uns à côté des autres.

<div style="float: left; width: 100px; height; 100px; margin: 5px">

<img src="/tonimage1" alt="" /><br />Ta légende

</div>

et tu continues en répétant le même code.

Regardes déjà si ça te convient, après tu mets le style dans une CSS, sous la forme #cadre pour copier une seule fois la mise en page.

Posté

Bonjour et Merci pour vos réponses,

<div style="float: left; width: 100px; height; 100px; margin: 5px">
<img src="/tonimage1" alt="" /><br />Ta légende
</div>

Je viens de tester cela et ca marche tres bien :) merci iNCiTE Web.

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...