Referencia de JavaScript del panel desplegable
Foundation proporciona componentes de JavaScript para el panel desplegable que se enumeran a continuación.
Inicializando
Puede inicializar el panel en JavaScript mediante los complementos foundation.dropdown.js y foundation.core.js . El complemento foundation.core.js requiere las siguientes bibliotecas:
foundation.util.keyboard.js
foundation.util.box.js
Fundación.
Especifica la instancia del menú desplegable como se define a continuación:
var my_element = new Foundation.Dropdown(element);El menú desplegable incluye los siguientes eventos que se enumeran en la tabla:
| No Señor. | Nombre y descripción | Tipo |
|---|---|---|
| 1 | element Crea un objeto jQuery en un menú desplegable. |
jQuery |
| 2 | options Anula la configuración predeterminada del complemento. |
Objeto |
Opciones de complementos
Puede utilizar las siguientes opciones de complemento para personalizar la instancia desplegable.
| No Señor. | Nombre y descripción | Ejemplo |
|---|---|---|
| 1 | hoverDelay Especifica el tiempo necesario para abrir un submenú en un evento de desplazamiento. |
250 |
| 2 | hover Abre el submenú de eventos flotantes. |
falso |
| 3 | hoverPane No cierra el menú desplegable al pasar el cursor sobre el panel desplegable |
cierto |
| 4 | vOffset Proporciona el número de píxeles cuando abre el panel desplegable y el elemento de activación. |
1 |
| 5 | hOffset Proporciona el número de píxeles cuando abre el panel desplegable y el elemento de activación. |
1 |
| 6 | positionClass Se utiliza para ajustar la posición cuando se aplica la clase para ajustar. |
'parte superior' |
| 7 | trapFocus Este complemento atrapará el foco en el panel desplegable si abre el menú desplegable con los comandos del teclado. |
falso |
| 8 | autoFocus Se utiliza para establecer el foco en el elemento del panel. |
cierto |
Eventos
El panel desplegable proporciona los siguientes eventos que se enumeran en la tabla:
| No Señor. | Nombre y descripción |
|---|---|
| 1 | closeme.zf.dropdown Se utiliza para cerrar los otros menús desplegables abiertos. |
| 2 | show.zf.dropdown Muestra el panel desplegable cuando está visible. |
Funciones
El panel desplegable proporciona las siguientes funciones que se enumeran a continuación:
.getPositionClass - Especifica la posición actual del panel desplegable.
.open - Muestra el panel desplegable y dispara para cerrar otros menús desplegables utilizando el evento de burbujeo.
.close - Cierra el panel desplegable abierto.
.toggle - Cambia el panel desplegable.
.destroy - Destruye el panel desplegable.