Modalități de animație a textului

cu ajutorul etichetei (tag-ului) MARQUEE

Marquee este un element HTML care, în mare, face ca textul să se

miște (deplaseze) pe orizontală (implicit, de la stânga la dreapta) și/
sau pe verticală (de sus în jos).

EXEMPLE

1. Deplasarea textului pe orizontală

• De la dreapta la stânga – Aceasta este cea mai simplă

animație dat fiind faptul că nu avem nevoie de niciun atribut (clauză,
opțiune) pentru a o realiza.

<marquee>TEXT</marquee>

• De la stânga la dreapta – Vom adăuga etichetei atributul

direction care va primi valoarea „right” pentru a specifica direcția de
deplasare (implicit, valoarea atributului este „left”).

<marquee direction="right">TEXT</marquee>

• Alternativ – Vom adăuga etichetei atributul behavior care va

primi valoarea „alternate”.

<marquee behavior="alternate">TEXT</marquee>

2. Deplasarea textului pe verticală

• De jos în sus – Vom adăuga etichetei atributul direction care

va primi valoarea „up”.

<marquee direction="up">TEXT</marquee>

1
 • De sus în jos – Vom adăuga etichetei atributul direction care
va primi valoarea „down”.

<marquee direction="down">TEXT</marquee>

• Alternativ – Vom adăuga etichetei ambele atribute:

- direction care va primi valoarea „up” sau „down”;
- behavior care va primi valoarea „alternate”.

<marquee direction="up" behavior="alternate">TEXT</marquee>

OBSERVAȚIE

Pentru a fi „vizibilă” schimbarea direcției de deplasare (jos-sus),

trebuie folosit atributul „style” pentru a specifica înălțimea zonei din
fereastră (care poate fi dată în pixeli, de exemplu "height:100 px", sau în
procent relativ la înălțimea ferestrei, de exmplu "height:25%") pe care se
va realiza deplasarea pe verticală a textului.

<marquee direction="up" behavior="alternate"

style="height:100px">TEXT</marquee>

<marquee direction="up" behavior="alternate"

style="height:25%">TEXT</marquee>

3. Deplasarea textului simultan și pe orizontală și pe verticală

Pentru a combina cele 2 modalități de deplasare (pe orizontală și

pe verticală), folosim eticheta Marquee de 2 ori:
- 1 dată pentru deplasarea pe orizontală: atributul direction va primi
valoarea „left” sau „right”;

2
 - 1 dată pentru deplasarea pe verticală: atributul direction va primi
valoarea „up” sau „down””.

• De sus în jos și de la stânga la dreapta – Pentru prima

etichetă marquee, atributul direction va primi valoarea „down”, iar pentru
a doua etichetă marquee, atributul direction va primi valoarea „right”.

<marquee direction="down" > <marquee direction="right">

TEXT</marquee> </marquee>

OBSERVAȚIE

Cele 2 etichete Marquee se pot „schimba” între ele (defapt se

schimbă valorile atributelor direction) și se obține același rezultat.

• De jos în sus și de la dreapta la stânga – Pentru prima

etichetă marquee, atributul direction va primi valoarea „up”, iar pentru a
doua etichetă marquee, atributul direction va primi valoarea „left” (poate
lipsi, deoarece se consideră valoarea implicită care este „left”).

<marquee direction="up" style="height:100px"> <marquee>

TEXT</marquee> </marquee>

OBSERVAȚIE

Pentru cele 2 etichete Marquee se poate considera orice

combinație de valori pentru atributul „direction”, cu condiția ca unul dintre
atribute să primească o valoare corespunzătoare deplasării pe orizontală,
iar celălalt o valoare corespunzătoare deplasării pe verticală.

• Alternativ – Vom adăuga atributul „behavior” cu valoarea

„alternate” uneia dintre cele 2 etichete Marquee sau amândurora.

3
Se pot considera cazurile:

<marquee direction="up" behavior="alternate" style="height:10%">

<marquee>TEXT</marquee> </marquee>

<marquee direction="up" > <marquee behavior="alternate">

TEXT</marquee> </marquee>

<marquee direction="up" behavior="alternate">

<marquee behavior="alternate">
TEXT</marquee> </marquee>