Plusieurs diapos ur une meme page/iweb

[monvilain]

Ok cool..

Tiens ma soeur habite Namur. Beau pays que la belgique.

va pour ton ZIP

 

[Anonyme]

Je précise qu'il n'y a pas de programme en php qui tourne derrière pour gérer la galerie : il faudra éditer le fichier html à la main. Je ferai un mode d'emploi, ce n'est pas compliqué.

 

[p4bl0]

J'adore etre catégorique.Qu'est ce que je peux etre c__ des fois.

Mes smileys c'était pour le mot "sport" (que j'ai mis en gras dans la citation)


Sinon il n'y a pas de rapport entre être con (tu peut l'écrire entier, vBull met des étoiles si il aime pas ) et s'intéresser ou pas au dev web :rateau:

 

[monvilain]

"Con" parce que de temps en temps ça aide et c'est pas si compliqué mais..;bon...ça reste du taf!

 

[Anonyme]

Alors, voici déjà le fichier zip. Le mode d'emploi dans quelques instants.

 

[Anonyme]

Préambule : Ficelle a créé un gabarit pour l'application Galerie de Didier Guillon qui utilise également jquery et thickbox. Si vous ne voulez pas mettre les mains dans le cambouis et n'avez pas besoin de plusieurs galeries sur une page, allez voir dans le forum Photo dans le sujet épinglé.

Le contenu de l'archive se compose comme suit :

• galerie
  • index.html
  • img
    • images… (les photos)
    • loadingAnimation.gif (la jauge animée)
  • css
    • ie_only.css (feuille de style annexe pur corriger les bugs dans IE6)
    • style.css (feuille de style de la page)
    • thickbox.css (feuille de style des boîtes thickbox)
    • macFFBgHack.png
  • js
    • jquery.js (la librairie de fonctions javascript)
    • thickbox.css (le plugin pour faire la présentation des photos)

Voici une partie du code de la page qui permet de présenter les images :

                <h2>Belgique</h2>
                <dl class="gallery">
                    <dt><a href="img/photo1_grand.jpg" class="thickbox" rel="magalerie" title="Ch&#226;teau-fort de Bouillon/Vue sur la cour du ch&#226;teau et la ville"><img src="img/photo1_petit.jpg" alt="" /></a></dt>
                    <dt>Ch&#226;teau-fort de Bouillon</dt>
                    <dd>Vue sur la cour du ch&#226;teau et la ville</dd>
                </dl>
                <dl class="gallery">
                    <dt><a href="img/photo2_grand.jpg.jpg" class="thickbox" rel="magalerie" title="La semois/Vue du ch&#226;teau"><img src="img/photo1_petit.jpg.jpg" alt="" /></a></dt>
                    <dt>La Semois</dt>
                    <dd>Vue du ch&#226;teau</dd>
                </dl>

Entre h2, le sous-titre, enfin le titre de la première galerie.

<h2>Belgique</h2>

Puis pour afficher une photo on utilise une liste de d&#233;finition (<dl>) mais avec deux termes et une d&#233;finition.

                 <dl class="gallery">
                    <dt><a href="img/photo2_grand.jpg.jpg" class="thickbox" rel="magalerie" title="La semois/Vue du ch&#226;teau"><img src="img/photo1_petit.jpg.jpg" alt="" /></a></dt>
                    <dt>La Semois</dt>
                    <dd>Vue du ch&#226;teau</dd>
                </dl>

La liste d&#233;finition est affubl&#233;e de la classe gallery. Ensuite comme premier terme (<dt>) on utilise la photo en petit format avec un lien sur la photo en grand format.

                     <dt><a href="img/photo2_grand.jpg.jpg" class="thickbox" rel="magalerie" title="La semois/Vue du ch&#226;teau"><img src="img/photo1_petit.jpg.jpg" alt="" /></a></dt>

C'est que l'on va d&#233;finir l'appartenance &#224; telle ou telle galerie et le sous-titre lors de la pr&#233;sentation. Pour d&#233;finir les photos de la m&#234;me famille, il utiliser le m&#234;me rel pour le lien (ici magalerie). Pour le sous-titre, cela se d&#233;finit avec l'attribut title. Attention de ne pas oublier d'assigner une class thickbox pour que &#231;a puisse marcher. Ensuite comme deuxi&#232;me terme, le titre de la photo (en gras) et comme d&#233;fintion (<dd>), une petite explication.

Voil&#224;, il faut copier autant fois cette liste de d&#233;finition autant fois qu'il y a de photos en n'oubliant pas de changer ou non l'attribut rel et les liens sur les photos. Pour faire plusieurs galeries mais pas sur une seule page on peut dupliquer la page index.html et changer les liens.

Pour modifier le fichier html tu peux utiliser smultron, gratuit.

 

[monvilain]

Epatant de précision et d'accessibilité!
J'y fonce

 

[Anonyme]

Petite précision : j'ai mis des noms de fichier dans le post précédent qui n'existent pas dans l'archive. Dans le fichier archive ce sont des liens vers mon compte flickr.

Mais l'idée est la même.