Tableau comprenant des images cliquables vers médiabox et du texte

chti47

Juin 2014

Bonjour, je dois faire un tableau de 5 colonnes dont une avec une une image cliquable qui amène à la mediabox.Là tout va bien. Seulement cette image cliquable serait la première d’une série de photos du même objet présenté.Mon tableau aura plusieurs lignes avec chacune une image(cliquable vers médiabox) d’un objet différent de la ligne précédente.
Je ne suis peut-être pas très claire désolée !

Une idée ?
Merci à tous ceux qui voudront bien m’aider ;)

Chti47

Résolu

Par note Par date Par date chronologique

Indiquez l’intérêt que vous portez à cette réponse

0

Fa_b

Juin 2014

Bonjour,
Euh oui ça n’est pas très clair.
En résumé si je crois comprendre, lorsque tu cliques sur image, la médiabox s’ouvre et tu peux naviguer dans une série de photos que l’on ne voit pas dans le tableau, c’est ça ? Et ainsi de suite pour une autre photo du tableau qui déclenche une nouvelle série ?
Indiquez l’intérêt que vous portez à cette réponse

0

Juin 2014

Oui tout à fait ? Comment faire stp ? une idée ?
Merci
Indiquez l’intérêt que vous portez à cette réponse

0

Fa_b

Juin 2014

Bonjour,
Deux techniques possibles au moins :
Mais d’abord il faut créer des séries de photos, soit toutes les photos d’un articles, soit par exemple un mot clé commun accroché à plusieurs photos.

Ensuite :
Soit créer un squelette galerie.html par exemple qui comprend à l’intérieur une boucle qui va afficher une série de photos (le lien fait passer un paramètre dans l’URL) méthode mediabox iframe :
<a href="[(#URL_PAGE{galerie}|parametre_url{mot,2})]" class="mediabox boxIframe">
Soit méthode « inline » les photos existent bien dans la page, mais seule la première est visible :
<a href="#" class="mediabox(#COMPTEUR_BOUCLE|=={1}|oui) visible]" rel="galerieX">… .visible {display:block}
Les autres étant display:none par défaut

À noter ici le rel="chose" qui permet de grouper les photos dans la box.

Voilà en gros les grandes lignes.
Indiquez l’intérêt que vous portez à cette réponse

0
Juillet 2014
Bonjour Fa_b,

Je résume de nouveau mon problème :
lorsque je clique sur l’image, la médiabox s’ouvre et je peux naviguer dans une série de photos que l’on ne voit pas dans le tableau. Et ainsi de suite pour une autre photo du tableau qui déclenche une nouvelle série.

Ca y est, je suis maintenant confrontée à ce cas.Je pense que la dernière solution que tu m’as proposé serait la mieux,mais j’avoue avoir du mal à comprendre où placer ton code<a href="#" class="mediabox(#COMPTEUR_BOUCLE|=={1}|oui) visible]" rel="galerieX">…

Toutes mes photos (pour une seule série) se trouvent dans le descriptif d’un article. Avec mon code,j’ai bien un diaporama ,mais toutes les photos de la rubrique s’ouvrent et pas seulement celles de l’article.
Voici le code de ma page html :
<table cellspacing="2px" cellpadding="2px;" rules="all" style="border:solid 1px #669933;"> <colgroup> <col width="150px;" /> <col width="200px;" /> </colgroup> <thead> <tr> <th>Type</th> <th>Photo</th> <th>Descriptif</th> </tr> </thead> <BOUCLE1(ARTICLES){id_rubrique=4}{par date}> <tr > <td class="case1"><h2>[(#TITRE)]<h2></td> <td class="case3" style="witdh:300px; height:200px">[(#DESCRIPTIF|image_reduire{300})] </td> <td class="case2">[(#TEXTE|image_reduire{300,200})]</td> </tr> </BOUCLE1> </B1> <//B1> </table>
Merci de bien vouloir m’aider un peu plus stp ?
Chti47
Indiquez l’intérêt que vous portez à cette réponse

0

Fa_b

Juillet 2014

Bonjour,

Ta solution me parait compliquée, tu dois simplifier cela.
Du côté admin, ne pas mettre tes images dans le #DESCRIPTIF, parce que ça devient plus compliqué à contrôler ensuite. Les associer à l’article en tant que PJ suffit amplement (à priori c’est déjà fait puisque ensuite tu les appelles dans #DESCRIPTIF).

Du côté public (squelettes), ta boucle 1 devrait ressembler plutôt à ça :
<style type="text/css"> .case3 {display:none} .case3.visible {display:block} </style> <BOUCLE1(ARTICLES){id_rubrique=4}{par date}> <tr > <td class="case1"><h2>[(#TITRE)]<h2></td> <BOUCLE_diaporama(DOCUMENTS){id_article}{extension==jpg|png|gif}{tout}> <td class="case3[(#COMPTEUR_BOUCLE|=={1}|oui) visible]" style="witdh:300px; height:200px"> <a href="#URL_DOCUMENT" rel="diaporama_#ID_ARTICLE" class="mediabox">(#FICHIER|image_reduire{300})]</a> </td> </BOUCLE_diaporama> <td class="case2">[(#TEXTE|image_reduire{300,200})]</td> </tr> </BOUCLE1>
Voilà, normalement toutes les td case3 sont cachées sauf la 1ere, et lorsque l’on clique dessus, la mediabox doit s’ouvrir et afficher le précédent/suivant permettant de naviguer dans ta galerie.
le rel="galerie_#ID_ARTICLE" permettant d’arrêter la navigation à chaque article.

Bon c’est du bricolage, ca devrait fonctionner (pour les td, je sais pas trop, j’utilise pas souvent ça, possible que ça décale quelque part, à voir)
Indiquez l’intérêt que vous portez à cette réponse

0

chti47

Juillet 2014

Bonjour ,
un très très grand MERCI !!!! Ça marche .C’était exactement ce qu’il me fallait.Grâce à toi ma journée commence plutôt très bien !Et quelle rapidité ! Je vais bien étudier ton code pour tout comprendre.
Bonne journée.

Chti47