Fondation - Révéler la référence JavaScript
Foundation fournit des composants JavaScript pour le modal de révélation comme indiqué ci-dessous -
Initialisation
Vous pouvez initialiser le volet dans le JavaScript à l'aide des plugins foundation.reveal.js et foundation.core.js . Le plugin foundation.core.js nécessite les bibliothèques suivantes -
foundation.util.keyboard.js
foundation.util.box.js
foundation.util.triggers.js
foundation.util.mediaQuery.js
foundation.util.motion.js
Fondation.Reveal
Il spécifie une instance de la révélation telle que définie ci-dessous -
var my_element = new Foundation.Reveal(element);La révélation comprend les valeurs ci-dessous telles qu'énumérées dans le tableau -
| N ° Sr. | Nom et description | Type |
|---|---|---|
| 1 | element Il utilise l'objet jQuery pour le modal. |
Nombre |
| 2 | options Il spécifie les paramètres facultatifs du modal. |
Objet |
Options de plug-in
Vous pouvez utiliser les options de plug-in suivantes pour personnaliser l'instance de révélation.
| N ° Sr. | Nom et description | Exemple |
|---|---|---|
| 1 | animationIn Il est utilisé pour les éléments animés. |
"glisser vers la gauche" |
| 2 | animationOut Il est utilisé pour les éléments animés. |
'slide-out-right' |
| 3 | showDelay Il affiche le temps nécessaire pour ouvrir le modal en ms. |
dix |
| 4 | hideDelay Il affiche le temps nécessaire pour fermer le modal en ms. |
dix |
| 5 | closeOnClick Il ferme le modal lorsque vous cliquez sur le corps ou la superposition. |
vrai |
| 6 | closeOnEsc Il ferme le modal lorsque vous cliquez sur la touche «ÉCHAPPEMENT». |
vrai |
| sept | multipleOpened Il affiche les multiples modaux à la fois. |
faux |
| 8 | vOffset Il spécifie la distance en pixels lorsque le modal doit pousser vers le bas depuis le haut de l'écran. |
100 |
| 9 | hOffset Il spécifie la distance en pixels lorsque le modal doit pousser vers le bas depuis le haut de l'écran. |
0 |
| dix | fullScreen Vous pouvez créer un mode plein écran en fonction de la largeur et de la hauteur de la fenêtre. |
faux |
| 11 | btmOffsetPct Lorsque le modal doit remonter du bas de la vue, il spécifie le pourcentage de hauteur de l'écran. |
dix |
| 12 | overlay Lorsque modal s'ouvre, il générera un div de superposition. |
vrai |
| 13 | resetOnClose Il spécifie que modal doit être réinitialisé lorsque vous le fermez. |
faux |
Événements
Reveal fournit les événements suivants répertoriés dans le tableau -
| N ° Sr. | Description de l'évenement |
|---|---|
| 1 | closeAll.zf.reveal Il ferme tous les modaux actuels avant d'ouvrir le nouveau modal. |
| 2 | open.zf.reveal Il déclenche l'événement lorsque vous ouvrez le modal avec succès. |
| 3 | closed.zf.reveal Il déclenche l'événement lorsqu'il ferme le modal. |
Les fonctions
Reveal fournit les fonctions suivantes -
| N ° Sr. | Description de la fonction |
|---|---|
| 1 | .open Il ouvrira le modal, qui est contrôlé par this. $ Anchor et fermera les autres modaux. |
| 2 | .close Cela fermera le modal. |
| 3 | .toggle Il bascule l'état d'un modal. |
| 4 | .destroy Il détruit l'instance modale. |