Ajouter un niveau à un menu

Bonjour,

En suivant les tutoriels de ce site (un très grand merci au passage pour tout ce travail très clair), j'ai installé un menu sur mon site.
Les menus proposés ayant seulement 2 niveaux, je voulais savoir s'il était possible d'en rajouter 1, avec par exemple, un affichage dans une boîte extérieure au menu (pour plus de clarté).

Merci.

PS : j'ai utilisé le menu vertical (Ma page)
Modifié par Bepimaco (24 Feb 2005 - 15:24)

Au niveau sémantique:

<ul>
 <li>Item 1</li>
 <li>Item 2</li>
 <li>Item 3
  <ul>
   <li>Item 3.1</li>
   <li>Item 3.2</li>
  </ul>
 [b][#red]</li>[/#][/b]
</ul>

Au niveau CSS:

li ul{
    /* Tu positionnes ton "sous-bloc" */
}

Sinon, va voir les modèles Alsacréations

Bonne chance,

@+ HoPHP

EDIT pour Anthony: le </li>. Mea Culpa.
Modifié par HoPHP (24 Feb 2005 - 21:45)

HoPHP, corrige ton petite erreur de sémantique sur ton code HTML "et" CSS
Modifié par anthony (24 Feb 2005 - 21:44)

Merci pour votre aide.

Je me suis plongé dans les différentes pages d'Alsacreation, mais aussi sur DoSimple et ibilab, mais je n'arive pas à adapter ce qu'ils proposent à ce que je voudrait faire. En fait, c'est un peu un mix des 2.

A l'ouverture, le menu présente 7 boutons. Si on clique dessus, le contenu se déroule sous chaque bouton. mais ensuite, pour éviter d'avoir un menu qui se déroule trop bas, le sous-menus apparaissent à droite du menu, au-dessus du texte.

Comme HoPHP l'a conseillé, j'ai rajouté des niveaux <ul><li></li></ul>, et j'ai rajouté les li ul dans la feuille de style ... mais ça ne donne rien.

Pouvez-vous jeter un oeil sur le code CSS et me dire ce qui cloche ?
Page HTML
Feuille CSS

HoPHP> non, toujours sémantique incorrecte sur ton code HTML
Pour la partie CSS, je trouves toujours étrange l'ordre "li ul", peut-être voulais-tu expliquer pour l'arborescence intérieure
Modifié par anthony (25 Feb 2005 - 11:49)

@Anthony> Je ne vois pas ton erreur. C'est comme ça que j'ai mis sur mon site et ça valide et (servi en application/xhtml+xml) ça ne cause pas d'erreur. Par ailleurs, cette syntaxe est celle utilisée par les tutos Alsa. Me trompé-je ? Ou alors, c'est la fatigue?

Pour ce qui est du sélecteur "li ul", c'est pour appliquer des propriétés uniquement aux listes (ul) qui sont dans un "item" (li), par conséquent, tous les sous-menus.

@+, HoPHP

P.S. D'ailleurs, même Pompage.net !
Modifié par HoPHP (25 Feb 2005 - 18:35)

HoPHP a écrit :
@Anthony> Je ne vois pas ton erreur. C'est comme ça que j'ai mis sur mon site et ça valide et (servi en application/xhtml+xml) ça ne cause pas d'erreur. Par ailleurs, cette syntaxe est celle utilisée par les tutos Alsa. Me trompé-je ? Ou alors, c'est la fatigue?

Pour ce qui est du sélecteur "li ul", c'est pour appliquer des propriétés uniquement aux listes (ul) qui sont dans un "item" (li), par conséquent, tous les sous-menus.

@+, HoPHP

je n'avais pas du être en forme ce matin, quand je n'avais pas vu de décalage ( je décale de 2 espaces entre <ul> et <li> pour la clareté ), et là j'avais pas tilté que tu avais fait en cascade

Pas grave.... De tout3 façon, tu es à moitié excusé. Actuellement, l'identation ne passe pas sur le forum

Ah oui, j'oubliais: BPMG à Bepimaco !!


@+, HoPHP

Étant donné que la réalisation d'un menu combinant 2 niveaux déroulant et un troisième qui s'affiche semble être très complexe, je vais m'orienter vers un menu plus simple, qui se déroule sur 3 niveaux.

Celui proposé par Alsacréation fonctionne très bien sur 2 niveaux, mais je n'arrive pas à intégrer le 3ème.
J'ai suivi vos conseils en intégrant les éléments entre les balises <li><ul>, et de fait, ils apparaissent comme sous-élements, comme voulu.

Le problème, c'est que les niveau 2 et 3 s'affichent en même temps. J'ai essayé de modifier le javascript, sans succès (faut-il rajouter une fonction ? une boucle ?)

Je travaille sur ce menu depuis pas mal de temps et j'ai l'impression de tourner en rond : ce que je veux faire est-il réalisable, ou vaut-il mieux abandonner tout de suite ?

La page
La feuille CSS

HoPHP> BPMG à toi aussi (et pour ne rien te cacher, tu viens de me l'apprendre )

Bepimaco a écrit :
Étant donné que la réalisation d'un menu combinant 2 niveaux déroulant et un troisième qui s'affiche semble être très complexe, je vais m'orienter vers un menu plus simple, qui se déroule sur 3 niveaux.

Puis-je me permettre une contre-proposition contructive ?

Faire un plan de site dans une page spécifique

Un menu n'est pas, ne peut pas, ne doit pas... être un plan de site, à moins que celui-ci ne se limite à une douzaine de pages et de liens. C'est:
- ergonomiquement inepte (j'ai autre-chose à faire que faire joujou avec ma souris et mémoriser des plages de liens furtifs propre à un site unique)
- "accessibilitiquement" (sic) illusoire (à moins d'être un as de la souris, et un mec patient en prime)
- et sémantiquement dénué de sens (il y a des liens relatifs pour sémantiser des collections de ressources, et des navigateurs qui les exploitent très bien, sous une forme pratique, elle).
- le plus souvent techniquement foireux en l'état des moyens disponibles.

Voilà voilà... Si, si. Relisez bien, c'était constructif
Modifié par Laurent Denis (26 Feb 2005 - 13:28)

Bonjour et merci pour votre remarque.

Avant de décider de cette organisation, j'ai bien reflechi à l'ergonomie et cette solution m'a semblée la plus appropriée.

En fait, les 2 premiers niveaux sont les principaux, le 3ème ne servant que pour détailler quelques rubriques. J'ai voulu regrouper toute la navigation par rubrique (les 3 niveaux) dans le menu pour plus de facilité et de compréhension.
De plus, le site est découpé en 7 parties qui disposent chacune de leur menu, et un plan général du site est disponible.

Voilà les éléments de réponse à ta contre-proposition.

Il me semblait que de faire une navigation en menu + autre chose pour les derniers niveaux ou plusieurs menus selon le niveau était un peu complexe pour l'utilisateur.

Encore merci

Bepimaco
Modifié par Bepimaco (26 Feb 2005 - 14:05)