Add Scrolling Text Marquee HTML Codes

Adding simple scrolling text:Here
is the code to add a simple scrolling text from right to left side

<marquee>code to simple scrolling <br /> text</marquee>
The output will be like:
Example 1:


code
to simple scrolling text


If you want some more
attraction,then try these,

Add a background color to the text,
<marquee <br /> bgcolor="#99CCFF">code to simple scrolling text</marquee>
Example 2:


code to simple scrolling text

You
can choose your background colour by replacing the hexadecimal code(#99ccff).
Click here to see the codes of the different
colors.

Here are some mode attributes to learn:

direction="left" direction="right" direction="up" direction="down"

The
above attributes tells the text which direction to scroll.
Use the
code below:
<marquee<br /> direction="right" bgcolor="#99CCFF">code to simple scrolling <br /> text</marquee>

Here is are some examples:
To
scroll in the 'right' direction:
Example 3:


code to simple scrolling text



Example 4:
To scroll
in the 'up' direction:


code to simple scrolling text



Example 5:
Downwards:(I
changed the hexa decimal codes for different colours)


code to simple scrolling text


few
more attributes:
You can add this attribute to alternate
the text
behavior="alternate"
Here
is the code to do this:
<marquee behavior="alternate" direction="down" <br /> bgcolor="#33FFCC">code to simple scrolling text</marquee>
Example 6:




code to simple scrolling text


You
can also set the speed of
the text with this simple attribute:
scrollamount="2"
The lower the
scrollamount value, the less the speed it moves,
the html code for
this:
<marquee <br /> behavior="alternate" direction="left" bgcolor="#9999CC" <br /> scrollamount="2">code to simple scrolling text</marquee>
example 7:(for scrollamout
=2)


code to simple scrolling text


Example 8:(for
scrollamount=5)


code to simple scrolling text


Pausing the text when mouse is over the
text:It is very useful when the reader wants to read the
text,and the scrollamount is big,sothat he will put the mouse over the
text to pause the text and read the matter:
Here is the code to do
this
<marquee <br /> behavior="alternate" direction="left" bgcolor="#CCCCCC" <br /> onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" <br /> scrolldelay="50"> code to simple scrolling text</marquee>
Example 9:


code to simple
scrolling text


(place the mouse over the text to
test it)
Changing the text
colour:
Here is the code to change the text colour:(Add
it before the marquee tag)
<span style="#FFFFFF">
So, the code looks
like this
<span><marquee<br /> onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4" <br /> bgcolor="#cccccc"><br /><br />code to simple scrolling <br /> text<br /><br /></marquee>
Example 10:




code to
simple scrolling text

Here is the important
one and most useful one, adding hyperlinks in
the scrolling text.
Hyperlink means a link when clicked go to
another location(site).
Let's see how to add hyperlinks to the
scrolling text:

Adding
hyperlinks(open in the same window):
Here is the sample code:
<marquee behavior="scroll" <br /> direction="left" bgcolor="#99FFFF" onmouseover="this.stop()" <br /> onmouseout="this.start()" scrollamount="4"> <a <br /> href="url#1">LINK#1</a> <a href="url#2">LINK#2</a><br /> <a href="url#3">LINK#3</a> </marquee>
NOTE:Replace
the Link#1,Link#2,Link#3 with the text and url#1,url#2 and
url#3 with the target url addresses.
Here is an example:
<marquee behavior="scroll" <br /> align="middle" direction="left" bgcolor="#99FFFF" scrollamount="4" <br /> onmouseover="this.stop()" onmouseout="this.start()"><br <br /> /><br /> <a href=" <br /> http://kranthitips.blogspot.com/2007/12/embed-flashflvswf-files-in-blogger.html<br /> ">Flash animations in your blog</a> <a href=" <br /> http://kranthitips.blogspot.com/2007/12/how-to-embed-youtube-videomovie-in-your.html<br /> ">Youtube videos</a> <a href=" <br /> http://kranthitips.blogspot.com/2007/12/hexa-decimal-color-chart-for-bloggers.html<br /> ">Hexadecimal codes</a><br /><br /> </marquee
The
output will look like this



Flash
animations in your blog Youtube
videos Hexadecimal
codes<>

If
you want to open the links in new window,here is the
code:
<marquee <br /> behavior="scroll" direction="left" bgcolor="#99FFFF" <br /> onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4"><br /> <a href="url#1">LINK#1</a> <a <br /> href="url#2">LINK#2</a> <a href="url#3">LINK#3</a><br /> </marquee>



That's it!Now you can add
this to your blogger sidebar,in the blog post,where ever you want.

If
you want to put this in sidebar,then sign in to your blogger
account>click the add a page element> and paste the code in
html/javascript and save the changes .This is shown in
the below pictures.







Next,