Cum faci sa rulezi un text

Textul rulant denumit si " marquee", imprima un efect de miscare asupra textului.
De obicei, textul rulant este utilizat de către proprietarii de blog pentru a afisa un mesaj, link sau banner pentru a atrage vizitatori.
Exista mai multe posibilitati de a face un text sa ruleze: de la stanga la dreapta (sau invers), de sus in jos (sau invers).Codul HTML trebuie introdus direct in modul "HTML" asa cum apare el in instructiunile urmatoare.

1.Face textul sa "curga" de la dreapta la stânga (implicit).
Codul HTML :
<marquee> Textul ruleaza de la dreapta la stanga</ marquee>
Efect :
Textul ruleaza de la dreapta la stanga

2.Face textul sa "curga" de la stânga la dreapta
Codul HTML
<marquee behavior="scroll" direction="right" height="23" width="auto"> Textul ruleaza de la stanga la dreapta </ marquee>
Efect :
Textul ruleaza de la stanga la dreapta

3.Putem ca textul sa ruleze cu o viteza mai mica sau mai mare, modificand in codul HTML scrollamount="5"- cifra 5 (spre exemplu), face ca textul sa ruleze cu o viteza mai mica .
Codul HTML <marquee behavior="scroll" direction="left" scrollamount="5"> Textul se deplaseaza mai lent </ marquee>
Efect :
Textul se deplaseaza mai lent
Daca inlocuim cifra 5, cu o valoare mai mare, spre exemplu 30, textul se va deplasa mai repede.
Codul HTML
<marquee behavior="scroll" direction="left" height="100" scrollamount="30" width="auto"> Textul se deplaseaza mai repede </ marquee>

Efect :
Textul se deplaseaza mai repede

4.Putem face ca textul sa apara pe un fond de o alta culoare, spre exemplu rosu.

Codul HTML :
<marquee bgcolor="red" height="23" width="auto">Textul ruleaza pe un fond rosu</ marquee>

Efect :
Textul ruleaza pe un fond rosu
 
5.Deasemenea, putem face ca textul sa se deplaseze vertical, de jos in sus sau de sus in jos.

Codul HTML
<marquee behavior="scroll" direction="up" height="200" width="auto">Textul de deplaseaza de jos in sus</marquee>

Efect :

Textul de deplaseaza de jos in sus

In textul rulant putem sa introducem si link-uri catre una sau mai multe pagini web.

Codul HTML
<div style="border: 1px solid rgb(202, 61, 217); height: overflow: auto; padding: 5px;">
<b>
<marquee behavior="scroll" direction="up" scrollamount="3">
<a href="http://fa-ti-un-blog.blogspot.ro/">Cum sa-ti faci un blog?</a><br />
<a href="http://fa-ti-un-blog.blogspot.ro/p/cum-poti-castiga-bani-cu-blogul-tau.html">Cum poti castiga bani cu blogul tau?</a><br />
<a href="http://fa-ti-un-blog.blogspot.ro/p/cum-sa.html">Cum sa pui un video de pe youtube pe blog</a></marquee></b></div>


Schimband in codul HTML de mai sus direction="down" textul se va deplasa de sus in jos.

<div style="border: 1px solid rgb(202, 61, 217); height: overflow: auto; padding: 5px;">
<b>
<marquee behavior="scroll" direction="down" scrollamount="3">
<a href="http://fa-ti-un-blog.blogspot.ro/">Cum sa-ti faci un blog?</a><br />
<a href="http://fa-ti-un-blog.blogspot.ro/p/cum-poti-castiga-bani-cu-blogul-tau.html">Cum poti castiga bani cu blogul tau?</a><br />
<a href="http://fa-ti-un-blog.blogspot.ro/p/cum-sa.html">Cum sa pui un video de pe youtube pe blog</a></marquee></b></div>

Efect :

Mai mult, in exemplul de mai jos se pot seta dimensiunea, culoarea si tipul textului, folosind urmatorul cod :

<marquee><font  size="8" face="arial" color="blue"> Bine ati venit pe blogul meu !</ font> </ marquee>

In codul de mai sus:
   a. font size = "8", numarul 8 reprezinta dimensiunea textului care poate fi schimbata dupa cum doriti
   b. face = "arial", este tipul de caractere arial
   c. color = "blue", albastru este culoarea textului.

Bine ati venit pe blogul meu !

Mult succes !

Niciun comentariu:

Trimiteți un comentariu