Foundation - Référence JavaScript Dropdown
Foundation fournit des composants JavaScript pour un menu déroulant comme indiqué ci-dessous.
Initialisation
Vous pouvez initialiser le menu déroulant dans JavaScript à l'aide des plugins foundation.dropdownMenu.js et foundation.core.js . Le plugin nécessite les bibliothèques suivantes -
foundation.util.keyboard.js
foundation.util.box.js
foundation.util.nest.js
Fondation.DropdownMenu
Il spécifie l'instance d'un menu déroulant tel que défini ci-dessous -
var elem = new Foundation.DropdownMenu(element);| N ° Sr. | Nom et description | Type |
|---|---|---|
| 1 | Element Il crée un objet jQuery dans un menu déroulant. |
jQuery |
| 2 | Options Le paramètre par défaut du plug-in est remplacé. |
Objet |
Options de plug-in
Vous pouvez utiliser le plugin suivant pour personnaliser l'instance de menu déroulant. Vous pouvez définir l'option du plugin en tant qu'attributs de données individuels.
| N ° Sr. | Nom et description | Exemple |
|---|---|---|
| 1 | disableHover L'événement de survol est désactivé à l'ouverture des sous-menus. |
faux |
| 2 | autoclose Automatiquement, les sous-menus sont fermés lorsque la souris quitte l'événement. |
vrai |
| 3 | hoverDelay Il retarde le temps lors de l'ouverture des sous-menus lors d'un événement de survol. |
50 |
| 4 | clickOpen Les sous-menus sont autorisés à rester ouverts lors d'un événement de clic parent. |
vrai |
| 5 | closingTime Il retarde le temps lors de la fermeture des sous-menus lors d'un événement de sortie de la souris. |
500 |
| 6 | alignment Selon le menu, la direction est définie pour ouvrir les sous-menus. |
'la gauche' |
| sept | closeOnClick Les sous-menus ouverts sont fermés par un clic sur le corps. |
vrai |
| 8 | verticalClass Pour définir le menu vertical, la classe verticale est utilisée. |
'verticale' |
| 9 | rightClass Réglez le menu sur le côté droit. |
'align-right' |
| dix | forceFollow Pour effectuer l'action par défaut, le booléen est forcé de remplacer les liens de clic sur le deuxième événement tactile pour mobile. |
faux |
Événements
Le plugin des menus déroulants attaché à n'importe quel élément peut déclencher l'événement suivant.
| N ° Sr. | Nom et description |
|---|---|
| 1 | show.zf.dropdown menus Il déclenche un événement lorsqu'un nouveau volet déroulant est visible. |
| 2 | hide.zf.dropdown menus Il déclenche un événement lorsque les menus ouverts sont fermés. |
Les fonctions
.détruire
Le plugin est détruit.