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.