Galerie photo

[etoundi]

Bonjour,

je coince sur une galerie photo. Le principe est simple, il s'agit d'aller chercher le chemin des images dans une base de donnee et de les afficher dans un tableau en faisant une boucle.

http://www.uaeucan.com/getinvolved/water.p...how=testgallery

Or les photos se mettent sur la meme ligne. Je voudrai que les photos ne depassent pas la largeur du site et se mettent sur une autre ligne et fassent des rangees de 6.

J'ai commence par faire plusieurs requetes afin de mettre des photos differentes a chaque lignes mais ca ne marche pas.

Est-ce un probleme de CSS plutot ?

Merci.

[Compte supprimé]

heu... est ce que tu fais bien la différence entre php, html, css ?

Si tu souhaite conserver des tableaux (c'est pas le choix que j'aurais) et afficher 6 images par ligne, dans ta boucle met un compteur qui rajoute "<tr></tr>" toutes les 6 itérations...

[etoundi]

Je n'avais pas pense a ca effectivement...

Sinon j'ai trouve un petit script tout simple avec des listes et qui me convient bien : http://css.alsacreations.com/Tutoriels-Jav...hoto-javascript .

En revanche je suis curieux de connaitre ta methode.

[deepo]

hello

si je peux me permettre et ça peut servir à d'autres

jeroen parle d'une méthode comme ça je pense

<?php
//----un peu épuré pour l'exemple
//---------- initialise le compteur
$i = 0;
//----------------------------------- commence le tableau...
echo ( "<table class=\"tabfoto\">\n" ) ;

//-------------une boucle, la valeur $NbLieu venant d'une requête placée plus haut
	for ( $Res = 1 ; $Res <= $NbLieu ; $Res++ )
	{
		$ligne = ( ' <td valign="middle" align="center">\n  '.
				   '<img alt="" title="" src="chemin/$Photo"></td>\n' ) ;

		//-----dans ce cas 6 images par ligne		
		if ($i%6==0)
		{
			//----- commence une ligne du tableau
			echo ( "\n<tr>\n" ) ; 
		}		
		if( $i %6 != 0 OR $i %6 == 0 )
		{
			//------------------ affiche une ligne
			echo ( "".$colonne."" ) ;
		}
		//---------- incrémente le compteur		
		$i++ ;
		if ( $i % 6 == 0 )
		{
			//------------ ferme la ligne
			echo ( "\n</tr>\n" ) ;
		}
	}
//--------------------- ferme le tableau
echo ( "\n</table>" ) ;
?>

c'est une méthode qui fonctionne bien mais que je n'utilise plus

parce que le tableaux pour les images c'est maaaaal

je préfère donc utiliser une méthode basée sur les div et l'option float

issu des explications

le css

/*-------  source  :    http://openweb.eu.org/articles/initiation_float/       ------ */
#contenu {
	background-color: #ffffff;
	padding: 0;
	margin: 0;
	width: 400px;	/* taille fixe a adapter */
}
.image {
	background-color: #000000;
	float: left;
	padding: 2px;
	margin: 5px;
	width: 80px;	/* largeur de l'image */
	height: 60px;	/* hauteur de l"image */
}

et l'affichage dans le html

<div id="contenu">
	<!-- on peut placer le tout dans une boucle en php si on utilise une base de donnée
  sinon on affiche autant d'images qu'on veut, quand le nombre d'image rempli
  la largeur du contenu, ça passe à la ligne automatiquement -->
	<div class="image"><img alt="" title="" src="chemin/mini_image1.jpg" /></div>
	<div class="image"><img alt="" title="" src="chemin/mini_image2.jpg" /></div>
	<div class="image"><img alt="" title="" src="chemin/mini_image3.jpg" /></div>
	<!-- etc...-->	
</div>

et du coup c'est valide

je suis débutant, aussi mille excuses aux puristes si il y a quelques erreurs

a bientôt

[captain_torche]

Même si tu ne l'utilises plus, je corrige ton premier code, qui est un tantinet trop complexe :

D'une part, il vaut mieux exloiter directement les résultats de la requête (plutôt que d'utiliser une boucle for), et ensuite, tu te prends un peu la tête avec les modulos.

<?php
$sql = "SELECT * FROM tatable";
$req = mysql_query($sql);
$nombre = 1;
echo '<table><tr>';
while($result = mysql_fetch_assoc($req)) {
if($nombre%6==0)
    echo '</tr><tr>';
echo '<td>';
echo '<img src="images/'.$result['ID'].'.jpg" />';
echo '</td>';
$nombre++;
}
while($nombre%6!=0) {
echo '<td></td>';
$nombre++;
}
echo '</tr></table>';
?>

[Edit : rajout de la boucle while en fin de code, pour finir avec un nombre correct de cellules]

Modifié 15 Mai 2006 par captain_torche

[etoundi]

Merci !

[deepo]

merci Captain_Torche

pour la correction

a+