Galerie ligne + colonne

24 août 2005, 15:36

Bonjour,

Sur la page des membres, s'affiche leur galerie. Et je voudrais savoir comment je peux faire pour afficher les photos sur trois colonnes et deux lignes. Car pour l'instant ça s'affiche sur trois colonnes et trois lignes

$rep_grande = ''$pseudo_m.'/';	
$rep = ''$pseudo_m.'/diapo/';

// Ouvre le répertoire $rep 
$dir = opendir($rep); 
$nb = 0; 

// Tant qu'on peut lire les fichiers du répertoire $rep 
while ($image = readdir($dir)) { 

    // Si $rep.$image est un fichier 
    if(is_file($rep.$image)) { 
        if ($nb == 3){ 
            echo "<tr>"; 
            $yes = 1; 
        } else { 
            $yes = 0; 
        } 
            // Affiche l'image portant le nom $image 
            echo "
		<SCRIPT LANGUAGE=\"JavaScript\">
	function PopupImage(img) 
	{
	w=open(\"\",'image','width=600,height=600,toolbar=no,scrollbars=no,resizable=yes');	
	w.document.write(\"<SCRIPT language=javascript>function checksize() { if (document.images[0].complete) {  window.resizeTo(document.images[0].width+12,document.images[0].height+30); window.focus();} else { setTimeout('check()',250) } }</\"+\"SCRIPT>\");
	w.document.write(\"<BODY onload='checksize()' leftMargin=0 topMargin=0 marginwidth=0 marginheight=0><IMG src='\"+img+\"' border=0>\");
	w.document.write(\"\");
	w.document.close();
	}
	</SCRIPT>
<td><a href='javascript:PopupImage(\"$rep_grande$image\")'><img src=\"$rep$image\" border='0'></a></td>"; 
  $nb = $nb+1; 
            if ($yes == 1){ 
                echo "</tr>"; 
                $nb = 0; 
            } 
    } 
}

Merci

24 août 2005, 16:09

Un indice :

if ($nb == 3){
            echo "<tr>";

24 août 2005, 18:19

Vi je sais mais ça ne change que le nombre de colonnes pas de ligne

25 août 2005, 10:40

Il va falloir refaire ton script au niveau logique.
En fait, il faut se demander :

Est-ce que toutes les galeries auront le même nombre d'images ?
Le même nombre maximum ? (en ce cas, tu choisis 5 images par ligne pour une galerie à 15 img maxi)

Pour le moment, le script crée des <td> pour toutes les images contenues dans le répertoire.(while ($image = readdir($dir)) { )
Or pour avoir 3 lignes, il faut déterminer le nb images / ligne, donc connaître le nb total d'images.

Une fois que tu as le nb total, tu divises par 3 (nb lignes voulues), et tu arrondis à l'entier supérieur.

ex : 13 images
13 / 3 = 4.33333
arrondir => 5

Tu crées un <tr>, tu fais ton script comme il est.
Et le test sera, si c'est la 5e image (variable $nb dans ton script), tu mets un </tr>

Donc le petit calcul à partir du nb d'images du répertoire va modifier la valeur (actuellement 3) d'images / ligne.

----------------------------

Tu peux t'intéresser à la fonction scandir() qui permet d'avoir la liste des fichiers d'un répertoire.
Je me permets aussi de te faire remarquer que si le fichier n'est pas une image, ton code s'exécute quand même...au moins faire un test sur l'extension (.jpg).
[/color]

25 août 2005, 11:32

Oui j'ai pensé à utilisé scandir car j'aimerais que
si y'a 4 photos = 2lignes 2 colonnes
si y'a 6 photos = 2lign 3colonnes
etc. et pour ça il faut calculer le nb de photos dans le dossier

Sauf que je comprends pas bien le principe. J'ai essayé ça :

$dir = opendir($rep); 
$nb = 0;
$nbLi = 0; 

// Tant qu'on peut lire les fichiers du répertoire $rep 
while (($image = readdir($dir))&&($nbLi != 2))  { 

    // Si $rep.$image est un fichier 
    if(is_file($rep.$image)) { 
            // Affiche l'image portant le nom $image 
            echo"<SCRIPT LANGUAGE=\"JavaScript\">
	function PopupImage(img) 
	{
	w=open(\"\",'image','width=600,height=600,toolbar=no,scrollbars=no,resizable=yes');	
	w.document.write(\"<SCRIPT language=javascript>function checksize() { if (document.images[0].complete) {  window.resizeTo(document.images[0].width+12,document.images[0].height+30); window.focus();} else { setTimeout('check()',250) } }</\"+\"SCRIPT>\");
	w.document.write(\"<BODY onload='checksize()' leftMargin=0 topMargin=0 marginwidth=0 marginheight=0><IMG src='\"+img+\"' border=0>\");
	w.document.write(\"\");
	w.document.close();
	}
	</SCRIPT>
<td><a href='javascript:PopupImage(\"$rep_grande$image\")'><img src=\"$rep$image\" border='0'></a></td>"; 
 $nb++;  
           } 
    if($nb % 3 == 0) { 
      echo '</tr><tr>'; 
      $nbLi++;  
    } 
}

mais ça marche pas.. je sais que c'est simple, mais j'arrive pas trop à écrire en code ce que j'aimerais :'(

25 août 2005, 11:42

ça marche pas parce que ton HTML est faux !
Vérifie ton code source HTML...où est le 1er <tr> ?

Sinon : écris ton code, en langage humain, étape par étape, et tout ira mieux...

Galerie ligne + colonne

Qui est en ligne