Foundation - Revelar Referência de JavaScript
O Foundation fornece componentes JavaScript para o modal de revelação, conforme listado abaixo -
Inicializando
Você pode inicializar o painel no JavaScript usando as foundation.reveal.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.util.triggers.js
foundation.util.mediaQuery.js
foundation.util.motion.js
Foundation.Reveal
Ele especifica a instância da revelação conforme definido abaixo -
var my_element = new Foundation.Reveal(element);A revelação inclui os valores abaixo, conforme listado na tabela -
| Sr. Não. | Nome e Descrição | Tipo |
|---|---|---|
| 1 | element Ele usa o objeto jQuery para o modal. |
Número |
| 2 | options Ele especifica os parâmetros opcionais para o modal. |
Objeto |
Opções de plug-in
Você pode usar as seguintes opções de plug-in para personalizar a instância de revelação.
| Sr. Não. | Nome e Descrição | Exemplo |
|---|---|---|
| 1 | animationIn É usado para elementos animados. |
'slide-in-left' |
| 2 | animationOut É usado para elementos animados. |
'slide-out-right' |
| 3 | showDelay Mostra o tempo que leva para abrir o modal em ms. |
10 |
| 4 | hideDelay Mostra o tempo que leva para fechar o modal em ms. |
10 |
| 5 | closeOnClick Ele fecha o modal quando você clica no corpo ou sobreposição. |
verdadeiro |
| 6 | closeOnEsc Ele fecha o modal quando você clica na tecla 'ESCAPE'. |
verdadeiro |
| 7 | multipleOpened Ele exibe os vários modais de uma vez. |
falso |
| 8 | vOffset Ele especifica a distância em pixels quando o modal deve ser empurrado para baixo a partir do topo da tela. |
100 |
| 9 | hOffset Ele especifica a distância em pixels quando o modal deve ser empurrado para baixo a partir do topo da tela. |
0 |
| 10 | fullScreen Você pode criar modal em tela cheia de acordo com a largura e altura da janela. |
falso |
| 11 | btmOffsetPct Quando o modal deve ser empurrado da parte inferior da visualização, ele especifica a porcentagem da altura da tela. |
10 |
| 12 | overlay Quando o modal for aberto, ele gerará uma div de sobreposição. |
verdadeiro |
| 13 | resetOnClose Ele especifica que modal deve ser redefinido quando você fechá-lo. |
falso |
Eventos
O Reveal fornece os seguintes eventos, conforme listado na tabela -
| Sr. Não. | Descrição do Evento |
|---|---|
| 1 | closeAll.zf.reveal Ele fecha todos os modais atuais antes de abrir o novo modal. |
| 2 | open.zf.reveal Ele dispara o evento quando você abre o modal com sucesso. |
| 3 | closed.zf.reveal Ele dispara o evento ao fechar o modal. |
Funções
O Reveal fornece as seguintes funções -
| Sr. Não. | Descrição da função |
|---|---|
| 1 | .open Ele irá abrir o modal, que é controlado por esta âncora. $ E fechar os outros modais. |
| 2 | .close Vai fechar o modal. |
| 3 | .toggle Ele alterna o estado de um modal. |
| 4 | .destroy Ele destrói a instância modal. |