Referência de JavaScript do painel suspenso
O Foundation fornece componentes JavaScript para o painel suspenso conforme listado abaixo.
Inicializando
Você pode inicializar o painel em JavaScript usando foundation.dropdown.js e foundation.core.js plugins. O plug-in Foundation.core.js requer as seguintes bibliotecas -
foundation.util.keyboard.js
foundation.util.box.js
Foundation.Dropdown
Ele especifica a instância do menu suspenso conforme definido abaixo -
var my_element = new Foundation.Dropdown(element);A lista suspensa inclui os seguintes eventos, conforme listado na tabela -
| Sr. Não. | Nome e Descrição | Tipo |
|---|---|---|
| 1 | element Ele cria um objeto jQuery em um menu suspenso. |
jQuery |
| 2 | options Ele substitui as configurações padrão do plugin. |
Objeto |
Opções de plug-in
Você pode usar as seguintes opções de plug-in para personalizar a instância suspensa.
| Sr. Não. | Nome e Descrição | Exemplo |
|---|---|---|
| 1 | hoverDelay Ele especifica o tempo necessário para abrir um submenu no evento de foco. |
250 |
| 2 | hover Ele abre o submenu em eventos de foco. |
falso |
| 3 | hoverPane Não fecha o menu suspenso ao passar o mouse sobre o painel suspenso |
verdadeiro |
| 4 | vOffset Ele fornece o número de pixels quando você abre o painel suspenso e o elemento de acionamento. |
1 |
| 5 | hOffset Ele fornece o número de pixels quando você abre o painel suspenso e o elemento de acionamento. |
1 |
| 6 | positionClass É usado para ajustar a posição quando a classe é aplicada para ajustar. |
'topo' |
| 7 | trapFocus Este plugin irá prender o foco no painel suspenso se você abrir o menu suspenso com comandos de teclado. |
falso |
| 8 | autoFocus É usado para definir o foco no elemento no painel. |
verdadeiro |
Eventos
O painel suspenso fornece os seguintes eventos, conforme listado na tabela -
| Sr. Não. | Nome e Descrição |
|---|---|
| 1 | closeme.zf.dropdown É usado para fechar os outros menus suspensos abertos. |
| 2 | show.zf.dropdown Ele mostra o painel suspenso quando está visível. |
Funções
O painel suspenso fornece as seguintes funções, conforme listado abaixo -
.getPositionClass - Especifica a posição atual do painel suspenso.
.open - Mostra o painel suspenso e dispara para fechar outros menus suspensos usando o evento bubbling.
.close - Fecha o painel suspenso aberto.
.toggle - Alterna o painel suspenso.
.destroy - Isso destrói o painel suspenso.