Foundation - Riferimento JavaScript off-canvas
Foundation fornisce componenti JavaScript per l'off-canvas come elencato di seguito.
Inizializzazione
È possibile inizializzare il riquadro in JavaScript utilizzando i plug-in foundation.offcanvas.js e foundation.core.js . Il plugin foundation.core.js richiede le seguenti librerie:
foundation.util.triggers.js
foundation.util.motion.js
Foundation.OffCanvas
Specifica l'istanza del wrapper off-canvas come definito di seguito -
var my_element = new Foundation.OffCanvas(element);
L'off-canvas include i seguenti eventi come elencati nella tabella:
Sr.No. | Nome e descrizione | genere |
---|---|---|
1 |
element Inizializza l'oggetto jQuery. |
Oggetto |
2 |
options Ignora le impostazioni predefinite del plugin. |
Oggetto |
Opzioni plugin
È possibile utilizzare le seguenti opzioni del plug-in per personalizzare l'istanza off-canvas.
Sr.No. | Nome e descrizione | Esempio |
---|---|---|
1 |
closeOnClick Chiude il menu quando l'utente fa clic al di fuori del menu. |
vero |
2 |
transitionTime Specifica il tempo necessario per aprire e chiudere la transizione in ms. |
500 |
3 |
position Definisce la direzione da cui deve aprirsi l'off-canvas. |
sinistra |
4 |
forceTop Forza lo scorrimento della pagina verso l'alto non appena viene aperta. |
|
5 |
isRevealed Aprirà l'area fuori dall'area di disegno fino a raggiungere i punti di interruzione rimanenti. |
falso |
6 |
revealOn Definisce il punto di interruzione in corrispondenza del quale rivelare l'Off-canvas. |
rivelare per grandi dimensioni |
7 |
autoFocus Si concentra su off-canvas quando si aprirà. |
vero |
8 |
revealClass Questa classe viene utilizzata per forzare un off-canvas a rimanere aperto. |
rivelare per grandi dimensioni |
Eventi
Off-canvas fornisce i seguenti eventi come elencato nella tabella:
Sr.No. | Nome e descrizione |
---|---|
1 |
opened.zf.off-canvas Attiva l'evento quando apre il menu off-canvas. |
2 |
closed.zf.off-canvas Attiva l'evento quando apre il menu off-canvas. |
Funzioni
Off-canvas fornisce le seguenti funzioni come definito di seguito:
.svelare
Aprirà l'area fuori dall'area di disegno fino a raggiungere i punti di interruzione rimanenti. Ha la seguente funzione come specificato nella tabella:
Sr.No. | Nome e descrizione | genere |
---|---|---|
1 |
isRevealed Rivela l'elemento se questa funzione è impostata su true. |
Booleano |
.Aperto
Si aprirà il menu fuori tela. Ha le seguenti funzioni come specificato nella tabella:
Sr.No. | Nome e descrizione | genere |
---|---|---|
1 |
event Passa l'oggetto evento dal listener. |
Oggetto |
2 |
trigger Attiva un elemento per aprire il fuori tela. |
jQuery |
.vicino
Chiude il menu off-canvas.
.toggle
Attiva / disattiva il menu off-canvas. Ha le seguenti funzioni come specificato nella tabella:
Sr.No. | Nome e descrizione | genere |
---|---|---|
1 |
event Passa l'oggetto evento dal listener. |
Oggetto |
2 |
trigger Attiva un elemento per aprire il fuori tela. |
jQuery |
.distruggere
Distrugge il plugin off-canvas.