Foundation - Riferimento JavaScript multimediale

Descrizione

Foundation fornisce componenti JavaScript per l'orbita come elencato di seguito.

Inizializzazione

Per utilizzare il plug-in orbit, i file foundation.core.js , foundation.orbit.js devono essere inclusi nel tuo JavaScript. Questo plugin richiede le seguenti librerie di utilità:

  • foundation.util.keyboard.js

  • foundation.util.motion.js

  • foundation.util.timerAndImageLoader.js

  • foundation.util.touch.js

Foundation.Orbit

Viene utilizzato per creare una nuova istanza di un carosello dell'orbita.

var elem = new Foundation.Orbit(element);

Sr.No. Nome e descrizione genere
1

element

È un oggetto jQuery da trasformare in una giostra.

jQuery
2

options

Sostituisce le impostazioni predefinite del plugin.

Oggetto

Opzioni plugin

Puoi usarli per personalizzare l'istanza di un'orbita. Può essere impostato come attributi di dati separati, un attributo di opzioni dati unito o come un oggetto passato al costruttore del plugin. La tabella seguente elenca le opzioni del plugin utilizzate in Foundation.

Sr.No. Nome e descrizione Esempio
1

bullets

Dice al JS di caricare i proiettili.

vero
2

navButtons

Indica al JS di aggiungere listener di eventi ai pulsanti di navigazione.

vero
3

animInFromRight

classe di animazione motion-ui da applicare.

"slide-in-right"
4

animOutToRight

classe di animazione motion-ui da applicare.

'slide-out-right'
5

animInFromLeft

classe di animazione motion-ui da applicare.

"slide-in-left"
6

animOutToLeft

classe di animazione motion-ui da applicare.

'slide-out-left'
7

autoPlay

Consente automaticamente all'orbita di animarsi al caricamento della pagina.

vero
8

timerDelay

Rappresenta il tempo in ms che verrà applicato per la transizione della diapositiva.

5000
9

infiniteWrap

Esegue un ciclo infinito tramite diapositive

vero
10

swipe

Consente alle diapositive dell'orbita di associare gli eventi di scorrimento per dispositivi mobili.

vero
11

pauseOnHover

Consente alle funzioni di temporizzazione di mettere in pausa l'animazione al passaggio del mouse su di essa.

vero
12

accessible

Associa gli eventi della tastiera allo slider.

vero
13

containerClass

Classe applicata al contenitore dell'orbita.

'orbit-container'
14

slideClass

Classe applicata alle singole diapositive dell'orbita.

"orbit-slide"
15

boxOfBullets

Classe applicata al contenitore del proiettile.

'proiettili-orbita'
16

nextClass

Classe applicata al pulsante successivo.

"orbita successiva"
17

prevClass

Classe applicata al pulsante precedente

"orbita precedente"
18

useMUI

Imposta Boolean per contrassegnare il JS per utilizzare o meno le classi dell'interfaccia utente di movimento. Per la compatibilità con le versioni precedenti, il valore predefinito è true.

vero

Eventi

Questi eventi si attiveranno da qualsiasi elemento con un plug-in allegato. Il slidechange.zf.orbit verrà attivato quando l'animazione è terminata dalla diapositiva.

Funzioni

Il .geoSync imposta un timer oggetto e avvia il contatore per la diapositiva successiva.

.changeSlide

Cambia la diapositiva in una nuova. Si innesca # Evento Orbit eventi per il cambiamento diapositiva. La tabella seguente elenca gli eventi che verranno attivati.

Sr.No. Nome e descrizione genere
1

isLTR

Segnala quando la diapositiva deve spostarsi da sinistra a destra.

Booleano
2

chosenSlide

jQuery elementi della diapositiva da visualizzare successivamente, quando ne viene selezionato uno.

jQuery
3

idx

Rappresenta il nuovo indice delle diapositive nella sua raccolta, quando ne viene scelto uno.

Numero

Il .destroy distrugge il carosello e nasconde l'elemento.