Avis sur un changement de la galerie JS d'Olivier

Salut,

pour des raisons d'esthétismes, j'ai modifié la structure de la galerie d'Olivier.

J'ai cherché à pouvoir placer les éléments de cette galerie comme je le souhaitais.

Visuellement il y a 3 éléments : la galerie de miniatures, la zone ou la photo s'affiche en grand et les commentaires.

Dans le code, les commentaires étaient "attachés" à l'image avec comme id=big_pict, dans une liste de définition : les commentaires sont la définition term et l'image la définition elle même (dd).

<dl id="photo">
<dt>Ici s'affichent les commentaires</dt>
<dd>
<img id="big_pict" src="maphoto.jpg" alt="commentaire de la photo" />
</dd>
</dl>

Pour arriver a ce que je voulais j'ai déstructurer le tout, ça fonctionne mais j'ai bien peur que la sémantique soit plus du tout là.

J'ai changé la valeur de l'id que js récupère

	var titre_photo = document.getElementById('definition').getElementsByTagName('dt')[0] ;

Pour pouvoir créer où je souhaite un conteneur avec cet ID et afficher les commentaires :

<div id="contain_nu">

<dl id="definition">
<dt>Les commentaires s'affichent là</dt>
</dl>

<ul id="galerie_mini">
	    <li></li>
   <li></li>
   <li></li>
   <li></li>
</ul>
</div>

et plus bas pour l'affichage de l'image :

<dl id="photo">
<dd><img id="big_pict" src="./largeimages/mont_visu_intro.jpg" alt="Galerie Print, cliquez sur les vignettes au dessus !" /></dd>
</dl>

La définition est coupée en deux...
Un <dl> avec un <dt> sans <dd> ça rime plus à rien non ?

Je me dis que si mes changements sont acceptables, je devrais les faire avec des balises neutres...car là ça me semble douteux je ce que bricole avec le <dl>...meme si ça fonctionne et que c'est valide...

Merci de vos avis.

Pour voir...
Modifié par Hum (21 Aug 2006 - 21:24)

Sans parler de sémantique et tout ces genre de gros mots...

Est ce que tu as vérifier le résultat de ce que tu envisages en mode nostyle ?

Et qu'est ce que tu en penses finalement ?

a écrit :
Sans parler de sémantique et tout ces genre de gros mots...

Est ce que tu as vérifier le résultat de ce que tu envisages en mode nostyle ?

Et qu'est ce que tu en penses finalement ?

Non j'avais pas regarder ....
Je viens de le faire et cela devait être mieux avant, maintenant j'ai le texte d'accueil de la page entre la galerie miniatures et l'affichage de l'image grande taille...
C'est la magie des floattants qu'il faut placer avant...heureusement qu'il n'y a que quelques lignes de texte...

Selon moi, ça se vaut.
Et toi qu'en dis tu en fait ?
Modifié par Hum (21 Aug 2006 - 21:43)

a écrit :
C'est la magie des floattants qu'il faut placer avant...heureusement qu'il n'y a que quelques lignes de texte...

Si ca rend pas bien en "flottant à gauche", tu peux toujours "floater à droite" ;o)
Modifié par petit-ourson (21 Aug 2006 - 22:26)

Hum a écrit :

Et toi qu'en dis tu en fait ?

Que le texte accompagnant la photo est séparé de celle ci par une liste dont on ne peut présumer le nombre d'item.

Et s'il y en avait beaucoup d'item ? ... ça fait loin quand même.

Déjà que ce n'est pas évident ce title transformer en contenu d'un balisage qui ne vaut que quand javascript est actif.

D'un autre coté on peut se dire que tant qu'à être dans le domaine de l'appesanteur ... Un peu plus, un peu moins...

Ce que j'en dit c'est que ce n'est pas du tout une bonne idée même sur du contenu généré.

<edit>
C'est très simple. Tout ce qui ne supporte pas la linéirésation doit être exclu
</edit>
Modifié par clb56 (21 Aug 2006 - 22:33)

Bien.

Je comprend, je ne regardais que les images sur ce coup là et pas les commentaires qui sont séparés de l'image.

Oui les floattants, ça devrait être faisable, vu que la liste d'item et que les commentaires floattent chacun de leurs cotés j'ai juste a faire l'inverse.

Dans ce cas le commentaire serait à coté de son image.

Merci
Modifié par Hum (21 Aug 2006 - 22:47)

Les flottants c'est du css...

Les css ne servent pas à penser mais seulement à jongler.

C'est le html en lui même qui permet de penser ce que l'on fait.

D'abord penser...

Oui

J'y penserai demain je crois , il y a de toutes façons le texte d'accueil entre...

Ok après léger remaniement de mon code HTML je pense avoir une linéarisation correcte pour le même résultat visuel.

J'ai pris conscience de cette importance, merci Clb56.

Ma liste de définition est juste a coté de son image.

Mes interrogations sur cette liste coupée en deux sont toujours là, et mes questions par rapport au fait de devoir utiliser d'autres balises aussi :

Ca ressemble à ça :

[b]
<dl id="definition">
<dt>Afficher une image en cliquant sur les vignettes ci-contre</dt>
</dl>
[/b]
</div>      <!--Fin de contain_nu-->


<div id="galerie">
<div id="galerie_foot">
	[b] 
<dl id="photo">
<dd><img id="big_pict" src="./largeimages/mont_visu_intro.jpg" alt="Galerie Print, cliquez sur les vignettes au dessus !" /></dd>
</dl> [/b]

</div> <!--Fin de la galerie-->
</div>
<hr class="separateur"/>
	
</div> <!--Fin de global foot et du spread -->
</div>
</div>

</body>
</html>

La page

J'ai maintenant un problème, quand je change de page en cliquant sur un des liens du menu, la deuxième ligne de <li> de ma galerie de miniatures se décale vers le bas....enfin c'est autre chose ça...