Menus déroulants [dropdown, dropup, ...]
Exemples sans Javascript :
- avec un seul niveau (un seul sous-menu)
- dropdown dont le code CSS a une présentation compatible avec les BPs listées dans ce cours
- W3Schools : dropdown,
dropup ; voir aussi
Tooltip pour un simple
pop-up d'information
- exemple de Blogspot
- Notes :
- l'élément Select de
HTML est une sorte de "dropdown à un seul niveau, sans Javascript"
mais il permet de sélectionner une valeur plutôt que de déclencher une action ;
des règles CSS peuvent lui être associées (e.g., voir
1,
2,
3)
MAIS aucun autre élément HTML ne peut être utilisé dans ses options.
- l'élément Dialog de
HTML (2024) est un pop-up qui peut être utilisé pour un menu déroulant
(e.g., si son contenu est un élément Select) mais, comme il requiert généralement du
Javascript
pour sa gestion, est de nouveau référé ci-dessous.
- l'élément Menu de HTML n'a pas plus de relation avec un menu déroulant que les autres
éléments HTML pour les listes (→ UL et OL) ; tous ces éléments peuvent toutefois être
complétés par
du CSS ou du JS pour implémenter des menus déroulants.
- avec plusieurs niveaux
Exemples avec Javascript
(+ JQuery généralement)
(→ non utilisables dans le cours "Projet HTML") :
- avec un seul niveau
- avec plusieurs niveaux