Riferimento JavaScript nel riquadro a discesa

Foundation fornisce componenti JavaScript per il riquadro a discesa come elencato di seguito.

Inizializzazione

È possibile inizializzare il riquadro in JavaScript utilizzando i plug-in foundation.dropdown.js e foundation.core.js . Il plugin foundation.core.js richiede le seguenti librerie:

  • foundation.util.keyboard.js

  • foundation.util.box.js

Fondazione Dropdown

Specifica l'istanza del menu a discesa come definito di seguito:

var my_element = new Foundation.Dropdown(element);

Il menu a discesa include i seguenti eventi elencati nella tabella:

Sr.No. Nome e descrizione genere
1

element

Crea un oggetto jQuery in un menu a discesa.

jQuery
2

options

Ignora le impostazioni predefinite del plugin.

Oggetto

Opzioni plugin

È possibile utilizzare le seguenti opzioni del plug-in per personalizzare l'istanza dell'elenco a discesa.

Sr.No. Nome e descrizione Esempio
1

hoverDelay

Specifica il tempo impiegato per aprire un sottomenu in caso di passaggio del mouse.

250
2

hover

Apre il sottomenu sugli eventi hover.

falso
3

hoverPane

Non chiude il menu a discesa quando si passa con il mouse sul riquadro a discesa

vero
4

vOffset

Fornisce il numero di pixel quando apri il riquadro a discesa e l'elemento di attivazione.

1
5

hOffset

Fornisce il numero di pixel quando apri il riquadro a discesa e l'elemento di attivazione.

1
6

positionClass

Viene utilizzato per regolare la posizione quando viene applicata la classe per regolare.

'superiore'
7

trapFocus

Questo plug-in intrappolerà lo stato attivo nel riquadro a discesa se apri il menu a discesa con i comandi della tastiera.

falso
8

autoFocus

Viene utilizzato per impostare il focus sull'elemento nel riquadro.

vero

Eventi

Il riquadro a discesa fornisce i seguenti eventi come elencato nella tabella:

Sr.No. Nome e descrizione
1

closeme.zf.dropdown

Viene utilizzato per chiudere gli altri menu a discesa aperti.

2

show.zf.dropdown

Mostra il riquadro a discesa quando è visibile.

Funzioni

Il riquadro a discesa fornisce le seguenti funzioni come elencato di seguito:

  • .getPositionClass - Specifica la posizione corrente del riquadro a discesa.

  • .open - Mostra il riquadro a discesa e si attiva per chiudere altri menu a discesa utilizzando l'evento di bubbling.

  • .close - Chiude il riquadro a discesa aperto.

  • .toggle - Attiva / disattiva il riquadro a discesa.

  • .destroy - Distrugge il riquadro a discesa.