Text Direction or Moving

Text direction or Text moving is a wonderful element for a website. You can scroll your text by marquee commands. By marquee sub coding you can scroll your text from left to right, right to left, top to bottom, bottom to top etc. Text direction is easy to do. All are text direction coding is here. We wish to publish all kind of text direction. All kind of text direction related direction codes are below. You can easy to do it if you see this post clearly. We published this text moving direction code by marquee step by step.

(1) Firstly text direction from left to right & right to left. It is a default direction from left to right & right to left. At all some test goes from left to right & right to left direction. By code marquee direction=right & marquee direction=left we create moving text that means text direction from left to right & right to left.

Code

[code language=”css”]
<marquee direction=right>Direction to Right</marquee>
<marquee direction=left>Direction to Left</marquee>
[/code]

Show

Direction to Right
Direction to Left


(2)
Now we published for text behavior. If you need text come from left or right & go other side and stop, you can create it by marquee behavior=slide coding. On the other hand if you need your text direction from left to right to left without vanish & just your text goes right, collide & return left then again collide & return right and continue, you can create it by marquee behavior=alternate coding.

Code

[code language=”css”]
<marquee behavior=slide>Direction Left to Right to Left</marquee>
<marquee behavior=alternate>Direction Left to Right to Left</marquee>
[/code]

Show

Direction Left to Right to Left
Direction Left to Right to Left

(3) Now we are describe about text animation or text direction speed. By html marquee scrolldelay coding you can speedy or slowly moving your text. For text animation or text direction speed default delay is 85 here is a millisecond=1/1000th of a second that means 1000 is for 1 second and 500 is for half second.

Code

[code language=”css”]

<marquee> Text moving as a default</marquee>
<marquee scrolldelay=50> Text moving after 0.05 second
</marquee>
<marquee scrolldelay=500> Text moving after 0.5 second</marquee>
[/code]

Show

Text moving as a default
Text moving after 0.05 second
Text moving after 0.5 second

(4) If you need that text direction permission that means how many times text are moving or directing. Supposed you need your text moving only two time & after vanish then you use to marquee loop coding. Marquee default value is infinity that means normal marquee loop endless. Now you can use marquee loop=1/2/3– for loop. It gives you that, your text moving 1/2/3— times and then vanishes. On the other hand you can use 2 codes at a time. You can use marquee loop=1/2/3– & marquee behavior= slide at a time. It gives you that, your text moving 1/2/3— times and then visible and not move.

Code

[code language=”css”]
<marquee loop=2> Text only moving 2 times and vanish
</marquee>
<marquee loop=2 behavior=slide> Text only moving 2 times & stop
</marquee>
[/code]

Show

Text only moving 2 times and vanish
Text only moving 2 times & sotp

(5) For a background color of a marquee text you can use marquee bgcolor coding. It gives marquee text background color. You can create your background color with RGB color combination and hax code.

Code

[code language=”css”]
<marquee bgcolor=yellow>
Text only moving with Background color
</marquee>
[/code]

Show

Text only moving with Background color

(6) Now you create a text direction or moving box with your own space that means according to your page horizontal and vertical alignment. Here marquee hspace is for horizontal space & marquee vspace is for vertical space. Now as an example we use 10-60 as space as horizontal & vertical.

Code

[code language=”css”]
<marquee hspace=10 bgcolor=red>Horizontal Space 10</marquee>
<marquee hspace=60 bgcolor=red>Horizontal Space 60</marquee>
<marquee vspace=10 bgcolor=red>Horizontal Space 10</marquee>
<marquee vspace=60 bgcolor=red>Horizontal Space 60</marquee>
[/code]

Show

Horizontal Space 10
Horizontal Space 60
Horizontal Space 10
Horizontal Space 60