|
Page 2 sur 2 Région répétée Si on veut afficher plusieurs images il nous faut faire une région répétée, qui lira les enregistrements présents dans la base de données en boucle, suivant le nombre d'enregistrements spécifiés à afficher.
Afin de garder les conditions d'affichage, on doit bien sûr sélectionner celles-ci en même temps que l'image afin de les inclure dans la région répétée. Vous pouvez accéder à cette fonction via la fenêtre Application > Comportements de serveur ou via le menu Insertion > Applications dynamiques. 
Puis on choisit le nombre d'enregistrements à afficher. 
GetImageSize En sélectionnant l'image et la région répétée, en mode source vous devriez avoir ce code : <?php do {?>
<a href="javascript:;" onClick="Lvl_openWin('pop.php?pop=<?php echo $row_rsVideo['id_video']; ?>','Jaquette','200','300','0','0','1','width=200,height=300')"> <img src="../images/tn_<?php echo $row_rsVideo['jaquette']; ?>" border="0" alt="ma jaquette" /></a>
<?php } while ($row_rsVideo = mysql_fetch_assoc($rsVideo)); ?> Nous allons ajouter la fonction GetImageSize afin de déterminer la taille de la grande image à afficher, et donc la taille voulu pour la pop-up.
Toujours en mode source, on tape ce code entre le début de la région répétée et le début du lien ouvrant la pop-up : <?php
$taille_pop = getimagesize("../images/$row_rsVideo[jaquette]");
?> $taille_pop est le nom de la variable, getimagesize le nom de la fonction, suivi du chemin du dossier contenant nos grandes images puis de la variable du jeu d'enregistrement et le champ contenant le nom des images dans la base de données.
À noter que le chemin du dossier doit être relatif au document. Puis on modifie le code JavaScript du comportement, afin de placer notre variable PHP permettant de déterminer la taille d'ouverture de la pop-up, en utilisant le tableau PHP et l'index correspondant, à savoir 0 pour la largeur et 1 pour la hauteur : <?php echo $taille_pop[0]; ?> ce bout de code va venir s'insérer à la place de la largeur et hauteur déterminé lors de l'application du comportement 4Level Open Browser. Ce qui nous donne : <?php do { ?>
<?php $taille_pop = getimagesize("../images/$row_rsVideo[jaquette]"); ?>
<a href="javascript:;" onClick="Lvl_openWin('pop.php?pop=<?php echo $row_rsVideo['id_video']; ?>','Jaquette','<?php echo $taille_pop[0]; ?>','<?php echo $taille_pop[1]; ?>','0','0','1','width=<?php echo $taille_pop[0]; ?>,height=<?php echo $taille_pop[1]; ?>')"> <img src="../images/tn_<?php echo $row_rsVideo['jaquette']; ?>" border="0" alt="ma jaquette" /></a>
<?php } while ($row_rsVideo = mysql_fetch_assoc($rsVideo)); ?> Page pop.php On ouvre à présent la page pop.php, dans laquelle nous allons créer un style CSS afin que l'image s'affiche sans marges et donc dans sa totalité. Dans le panneau Propriétés on fait Nouveau style CSS. 
On sélectionne la balise <body>, en cochant Redéfinir la balise HTML et Seulement ce document (on peut exporter le style dans une feuille de style externe par la suite). 
On affiche l'onglet Boite, puis dans Remplissage (padding) et Marge (margin) on entre comme valeur 0, en cochant Idem pour tous dans les deux cas. 
Le style est ajouté au <head> du document, on peut ajouter le média screen (pour écran). <style type="text/css" media="screen">
body {
margin: 0px;
padding: 0px; }
</style> Jeu d'enregistrement pop.php On doit maintenant créer le jeu d'enregistrement qui va nous permettre d'afficher l'image dont l'identifiant (video_id) est passé comme valeur de la variable pop dans l'URL, sur un clic d'une des vignettes de la page index.php, plutôt que de créer ce jeu d'enregistrement de toute pièce nous allons copier celui de la page index.php puis le modifier. Dans les Comportements de serveur de la page index.php on sélectionne le jeu d'enregistrement rsVideo, puis sur un clic droit on fait Copier. 
De la même manière dans la page pop.php on fait Coller. 
On double clique sur le jeu d'enregistrement, puis on le modifie afin de spécifier la variable permettant de passer la valeur de l'identifiant (video_id) de notre image. 
Le Filtre est le champ contenant la valeur de la variable, Paramètre d'URL la méthode grâce à laquelle est passé cette variable et pop le nom de la variable (choisi précédemment dans la page index.php). Puis on insère l'image dans la page pop.php, en spécifiant le dossier contenant les images, de la même manière que précédemment pour la page index.php, à part le préfixe "tn_" qui devient inutile. 
|
