Plugins Sticky JavaScript Reference
Foundation proporciona componentes de JavaScript para complementos Sticky que se enumeran a continuación.
Inicializando
Puede inicializar Sticky en JavaScript utilizando los complementos foundation.sticky.js y foundation.core.js . El complemento requiere las siguientes bibliotecas:
foundation.util.triggers.js
foundation.util.mediaQuery.js
Fundación.
Especifica una instancia de pegajosa como se define a continuación:
var elem = new Foundation.Sticky(element);| No Señor. | Nombre y descripción | Tipo |
|---|---|---|
| 1 | element Crea un objeto jQuery en un archivo sticky. |
jQuery |
| 2 | options La configuración predeterminada del complemento se anula. |
Objeto |
Opciones de complementos
Puede utilizar los siguientes complementos para personalizar la instancia permanente. Puede configurar la opción de complemento como atributos de datos individuales.
| No Señor. | Nombre y descripción | Ejemplo |
|---|---|---|
| 1 | container Para estilizar y dimensionar se pueden incluir clases propias. |
'' |
| 2 | stickTo Establece la ubicación donde debe pegarse el elemento. |
'parte superior' |
| 3 | anchor Incluye el id de ese elemento, que está anclado al elemento individual. |
'exampleId' |
| 4 | topAnchor Considera el ID de anclaje superior si se utilizan más elementos como puntos de anclaje. |
'exampleId: top' |
| 5 | btmAnchor Considera el ID de anclaje inferior si se utilizan más elementos como puntos de anclaje. |
'exampleId: bottom' |
| 6 | marginTop Establece el margen en em para el elemento superior cuando se vuelve pegajoso. |
1 |
| 7 | marginBottom Establece el margen en em para el elemento inferior cuando se vuelve pegajoso. |
1 |
| 8 | stickyOn La cuerda de punto de ruptura debe volverse pegajosa. |
'medio' |
| 9 | stickyClass Aplica clase al elemento adhesivo y lo elimina al destruirlo. |
'pegajoso' |
| 11 | containerClass Aplica clase al recipiente pegajoso. De forma predeterminada, es un contenedor adhesivo . |
contenedor pegajoso |
| 12 | checkEvery Los puntos pegajosos se vuelven a calcular por el número de eventos de desplazamiento entre los complementos. |
50 |
Eventos
Los complementos adhesivos adjuntos a cualquier elemento pueden desencadenar los siguientes eventos.
| No Señor. | Nombre y descripción |
|---|---|
| 1 | stuckto.zf.sticky Activa un evento cuando $ element se ha convertido en position: fixed; y Espaciado de nombres hacia arriba o hacia abajo . |
| 2 | unstuckfrom.zf.sticky Activa un evento cuando $ element se ha anclado y se ha colocado un espacio de nombres en la parte superior o inferior . |
Funciones
Las siguientes son las funciones utilizadas en sticky.
._pauseListeners
Para desplazarse por el evento, se elimina el controlador y el evento se cambia a ancla.
| No Señor. | Nombre y descripción | Tipo |
|---|---|---|
| 1 | scrollListener La ventana se adjunta con un oyente de desplazamiento con espacio de nombres único. |
cuerda |
._calc
En cada evento de desplazamiento , se llama a la calculadora y, dependiendo del valor booleano y en caché, _init dispara las funciones.
| No Señor. | Nombre y descripción | Tipo |
|---|---|---|
| 1 | checkSizes El complemento recalcula el tamaño y los puntos de interrupción si se establece en verdadero. |
Booleano |
| 2 | scroll Desplaza la posición actual del evento que se pasa desde la función cb. De lo contrario, de forma predeterminada, se establece en window.pageYOffset |
Número |
.destruir
El elemento pegajoso actual se destruye; el elemento se restablece a la posición superior. Elimina JS, que incluye clases y propiedades css y $ element se desenvuelve cuando JS incluye $ container .
.emCalc
La función auxiliar se utiliza para calcular los valores em.
| No Señor. | Nombre y descripción | Tipo |
|---|---|---|
| 1 | Number El número de ems se calcula en píxeles. |
em |