Add Sliding Text, Image to your Blogger Blog (Marquee Code)

In Todays tutorial we are going to use Marquee codes to add Sliding Text, Image to your Blogger Blog. You can make the text, images scroll from right to left, left to right, top to bottom, or bottom to top depending on yours choice.

1. Continuous scrolling text:


<!-- HTML codes by http://teachmeknow.blogspot.com/ -->
<marquee direction="left" bgcolor="#99CCFF">code to simple scrolling text</marquee>
<p><a href="http://teachmeknow.blogspot.com/2010/08/add-sliding-text-image-to-your-blogger.html">Marquee</a></p>


The above Code Result in:

code to simple scrolling text

2. Text bouncing back and forth:

<!-- HTML codes by http://teachmeknow.blogspot.com/ -->
<marquee behavior="alternate" bgcolor="#33FFCC">code to simple scrolling text</marquee>
<p><a href="http://teachmeknow.blogspot.com/2010/08/add-sliding-text-image-to-your-blogger.html">Marquee</a></p>

Above Code Results in:

code to simple scrolling text


3.
Text Scrolling Upwards:


<!-- HTML codes by http://teachmeknow.blogspot.com/ -->
<marquee behavior="scroll" direction="up" bgcolor="#33FFCC">code to simple scrolling text</marquee>
<p><a href="http://teachmeknow.blogspot.com/2010/08/add-sliding-text-image-to-your-blogger.html">Marquee</a></p>


Above Code Results in:


code to simple scrolling text



4. Text and Image both Scrolling:



<!-- HTML codes by http://teachmeknow.blogspot.com/ -->
<marquee behavior="scroll" direction="left">
<img src="http://1.bp.blogspot.com/_LUyoPU6ryUY/TFb2UGScLYI/AAAAAAAAAGI/zUHKXouN66Y/s200/BackupTemplateFirst.gif" width="100" height="100" alt="smile" />
<p>Sample text under a <a href="http://teachmeknow.blogspot.com/2010/08/add-sliding-text-image-to-your-blogger.html">Marquee image</a>.</p></marquee>

Above Code Results in:


smile

Sample text under a Marquee image.



Following are Changes you can make to existing Marquee Codes


  • direction- left, right, up, down
  • bgcolour- Any color you want for your background: get some color codes from here
  • behaviour- scroll, alternate

You are Done !!! Happy Blogging

No comments:

Post a Comment

Any Query related to any Post please feel free to comment on it so that I can Improve and provide you with better blog