Je veux afficher des vignettes les unes en-dessous des autres (maximum 3) puis à gauche (comme un tableau mais sans utiliser de <table>. Pour ca, j'ai une variables qui détermine le nombre de vignettes dans ma page Vignette.php:
<?php session_start();?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="IncludeCSS.php"> <style type="text/css"> <!-- #Vignettes { display:block; position:absolute; width:100%; height:100%; z-index:1; left: 130px; top: 96px;} --> </style> </head> <!--------------------------------------- Initialisation des chemins des vignettes ----------------------------------------> <?php $_SESSION['Img1']='Vignette_Macon'; $_SESSION['Img2']='Vignette_Venarey'; $_SESSION['Img3']='Vignette_Dijon'; $_SESSION['Img4']='Vignette_St-Genis'; $_SESSION['Img5']='Vignette_Dijon2'; ?> <!--------------------------------------- Initialisation des chemins des rollover ----------------------------------------> <?php $_SESSION['Roll1']='Vignette_Macon_50'; $_SESSION['Roll2']='Vignette_Venarey_50'; $_SESSION['Roll3']='Vignette_Dijon_50'; $_SESSION['Roll4']='Vignette_St-Genis_50'; $_SESSION['Roll5']='Vignette_Dijon2_50'; //Initialisation du nombre de vignettes $_SESSION['nb_vignettes']=5; ?> <body> <div id="Vignettes"> <div id="Vignette1"> <a class="v1" href="Macon.php"></a> <a id="Texte1" href="Macon.php" >Macon</a> </div> <div id="Vignette2"> <a class="v2" href="Venarey.php"></a> <a id="Texte2" href="Venarey.php" >Venarey</a> </div> <div id="Vignette3"> <a class="v3" href="Dijon.php"></a> <a id="Texte3" href="Dijon.php" >Dijon</a> </div> <div id="Vignette4"> <a class="v4" href="St-Genis.php"></a> <a id="Texte4" href="St-Genis.php" >St-Genis</a> </div> <div id="Vignette5"> <a class="v5" href="Dijon2.php"></a> <a id="Texte5" href="Dijon2.php" >Dijon</a> </div> </div> </body> </html>
Les id Vignette1, Vignette2, Vignettes3... sont les même à part les positions left et top.
J'ai donc fait un script PHP pour ne pas écrire tous les id VignetteX et pouvoir facilement rajouter une vignette.
Voila le code de ma feuille de style IncludeCSS.php:
<?header("Content-type: text/css");
// Initialisation des variables
$top = 0;
$top_texte = 34;
$left = 100;
$left_texte = 220;
$nb_lignes = 0;
$nb_colonnes = 0;
$i=3;
$x=1;
$num=0; //numero de la vignette
//Détermination du nombre de colonnes et de lignes
if ($nb_vignettes<=3) //si il y a au plus 3 vignettes
{
$nb_lignes = $nb_vignettes;
$nb_colonnes = 1;
}
else //si il y a plus de 3 vignettes
{
$nb_lignes = 3;
$nb_colonnes = 2;
$j=0;
while ($i<=$nb_vignettes)
{
$j++;
if( $j == 4 )
{
$nb_colonnes++;
$j = 0;
}
$i++;
}
}
for ($c=1; $c<=$nb_colonnes; $c++)
{
$top = 0;
$top_texte = 34;
// Boucle d'une colonne de vignettes
while ( ($x<=3) && ($num != $nb_vignettes) )
{
$num ++;
echo"#Vignette"; echo $num; echo" a.v";echo $num;
echo "{
position:absolute;
width:85px;
height:85px;
z-index:2;
left:";echo $left;echo "px;
top: ";echo $top;echo "px;
background: url(Projets/"; echo $_SESSION['Img$num];echo".gif) 0 0 no-repeat;
};
#Vignette";echo $num;echo" a:hover.v";echo $num;
echo"{
background: url(Projets/"; echo $_SESSION['Roll$num'];echo".gif) 0 0 no-repeat;
}
#Texte";echo $num;
echo"{
color: #FFFFFF;
font-size: 16px ;
font-family: \"Arial\";
position:relative;
display:inline;
left:";echo $left_texte;echo"px;
top:";echo $top_texte;echo"px;
}";
//Incrémentation des variables
$top = $top + 134;
$top_texte = $top_texte + 116;
$x++;
} // fin boucle while
$x=1;
$left = $left + 250;
$left_texte = $left_texte + 250;
}?> <!-- fin boucle for de c-->
Est-ce que je dois ajouter un session_start() dans la feuille de style? Dans ce cas, je risque d'avoir un problème parce qu'il y a deja le header (je ne peux rien mettre avant)
Merci d'avance pour votre aide!
