How to Add Moving Text to Blogger or Website(Magic Text)

 

THIS  TUTORIAL IS FOCUSED ON HOW TO MAKE YOUR BLOG OR WEBSITE LOOK ATTRACTIVE FOR THE VISITORS.

Here are the 11 Codes on 

How to add Moving text or 
Scrolling text or Marquee 
text to your Website 

---

This is moving text Moving Right to Left
Code 1

For Simple Moving Text:
Copy & paste this code In Html
 <marquee>This is moving text Moving Right to Left </marquee>

Surprisingly, Simple Moving Text do not look attractive much.
To make it attractive,
we will add background colour to it by bgcolor="hexadecimal code".

---

This is moving text With Background Colour

Code 2

For Moving Text With 
Background Colour:
Copy & paste this code In Html
<marquee bgcolor="#33cc99">This is moving text with Background Colour </marquee>

You will notice that text is not clearly readable.You can change the colour of the text.

---

This Is Coloured Scrolling Text With background colour.

Code 3

For Scrolling Text With 
Coloured Text & Background.:
Copy & paste this code In Html
<marquee bgcolor="#33cc99" style="color:white;">This Is Coloured Scrolling Text With Background Colour </marquee>

You can even control the 
speed of scrolling with scrollamount="

You can Put the value of 
number from 1 to 10 depend 
on the speed you want
Note: If you put value 
as 0 text will stop moving.

Now, 
I will teach you how to 
bold the moving text.

---

This Is Coloured Scrolling Bolded Text With background colour.

Code 4

 For Bolded Scrolling Text 
With Coloured Text &
 Background.:
Copy & paste this code In Html
<marquee bgcolor="#33cc99" style="color:white;"><b>This Is Coloured Scrolling  Bolded Text With Background colour </b></marquee>

You can make the text italic or underlined by replacing <b> with <i> or <u>.

---

This Is Scrolling Text with scrollamount="6"

Code 5

 For Scrolling Text With Speed Contol.:
Copy & paste this code In Html
<marquee bgcolor="#33cc99">This Is Scrolling Text with scrollamount="6" </marquee>

You can change direction of text with direction="option"

And options are
 left,right,up,down

Note:
By default direction is set to left.
By using direction ,
you are telling text in which direction to go.

---

This Is Moving Text with Up Direction
This Is Moving Text with Down Direction
This Is Moving Text with Left Direction
This Is Moving Text with Right Direction

Code 6

For Scrolling Text With
 Direction Control.
Copy & paste this code In Html
<marquee bgcolor="#33cc99" direction="up">This Is Moving Text with Up Direction </marquee>

You can change the 
behaviour of the text also 
from scrolling to alternate

---

This Is Moving Text with Alternate Behavior

Code 7

For Scrolling Text With
 Alterate Behaviour.:
Copy & paste this code In Html
<marquee bgcolor="#33cc99" behavior="alternate" style="color:white;">This Is Moving Text with Alternate Behavior</marquee>

Note:
By Default,
Behavior is set to scroll. 
Check the spellings of behaviour ,its behavior

---

Yahoo | Google | Blogger tips and tricks

Code 8

For Moving Links.:

Copy & paste this code In Html

<marquee bgcolor="#33cc99" style="color:white;"><br />
<a href="url">Link 1</a><br />
</marquee>

Note: Replace url with page address and link with text which should appears on moving text as link

In above case url is http://yahoo.com and link is yahoo.
http://google.com as url and google as link.

Place as many links as you wish.

---

Code 9

 For Moving Image.:
Copy & paste this code In Html

<marquee bgcolor="#33cc99" style="color:white;"><br />
Moving Image<img src="image url"><br /></marquee>

Note:

Replace image url by image 
Source address.

---

This Text Can be Paused.Just Point Mouse Over It.

Code 10

 For Pausing the text when 

mouse Cursor is pointed over the text::

Copy & paste this code In Html

<marquee bgcolor="#33cc99" style="color:white;width:500px;" onmouseover="this.stop()" onmouseout="this.start()"><br />
This text can be paused.Just Point Mouse Over It.<br />
</marquee>

Now, We will use all of the 
features mentioned above

---

Follow me on 

Code: 11 For Twitter, Facebook, LinkedIn etc

just change the www....

Copy & paste this code In Html

<marquee onmouseover="this.stop()" onmouseout="this.start()"<br />
bgcolor="#33cc99" style="color:white;width:300px;Height:130px;" scrollamount="4" direction="Up">Follow me on <a href="http://twitter.com/hellcaretaker"> <img src="twitter.com" alt="Twitter"> </a><br /></marquee>

---

In above case you can use image as a link
These features can be very 

usefull to give important news or making your blog attractive

HOW TO IMPLEMENT THE CODES

Note: Change this statement to any suitable text you want to display on your website "This Is Coloured Scrolling Text With Background Colour "
1.Login to www.Blogger.com

2.Click on Layout

3.Click on Add element

4.Html/Text

5.Paste the code