Scrolling Text

Un componente dinamico di sfondo che scorre ciclicamente attraverso una lista di testi ad un intervallo di tempo specificato.

Opzioni

text | (string|array<string>): testo o elenco di testi da visualizzare. Default: [].
loop | boolean: indica se il processo deve essere visualizzato all'infinito. Default: false.
direction | string: la direzione del flusso di testo (o "sinistra", "destra", "su", "giù", "traccia", "messa a fuoco" o "turbinio"). Default: 'right'.
hold | number: il tempo in cui il testo rimane fermo (in secondi). Default: 5.
wait | number: il tempo prima che arrivi un nuovo testo (in secondi). Default: 3.
inTime | number: tempo dell'effetto ingresso (in secondi). Default: 1.
outTime | number: tempo dell'effetto di uscita (in secondi). Default: 1.
className | string: nome della classe. Default: ''.
style | object: Stili CSS del testo. Default: {}.

Esempi

Minimal
List of Texts
Background Image

Editore dal vivo

<ScrollingText
    text="This is a text re-appearing every five seconds"
    style={{ fontSize: 44, color: 'blue' }}
    wait={5}
    hold={2}
    loop
/>

<ScrollingText
    text="This is a text re-appearing every five seconds"
    style={{ fontSize: 44, color: 'blue' }}
    wait={5}
    hold={2}
    loop
/>

Risultato

ReferenceError: Provider is not defined

Opzioni​

Esempi​

Opzioni

Esempi