How to add scrolling texts or images into blogger blog by using marquee tag - The WonderSpot - Know all in one spot
Breaking News:
Loading...

How to add scrolling texts or images into blogger blog by using marquee tag

Add scrolling images and text into blogger blog? marquee tag.

Today we discuss about how to add scrolling images or texts into blogger.

May be you have identified some text or images that should move or scrolling across the define section of blog or web pages in a horizontal or vertical direction or bouncing across some area. Would you interest to know how is that happening or Are you looking for how to scrolling images and text in blogger blog or other web sites?  Yep, today we discuss about that.

If you are working with blogger blog, you know that there are limited features in blogger platform than other blogging platforms. But by using HTML codes we can solve that issue.

How to add scrolling texts or images into blogger blog by using marquee tag
For scrolling images or text in the blog or web pages we can use ‘<marquee> tag’. That marquee tag used to move or scroll text and images across a section of a blog or web page in a horizontal or vertical direction or bouncing across some area. Before we discuss, you should know that, the ‘<marquee> tag’ is Obsolete and most of time should not be used because of unexpected results in using, limited support from the web browsers or by using the CSS or JavaScript we can create similar effects. But don’t worry still we can use that code to scrolling image or text without any issues. By using marquee tag you can do much more things rather than the scrolling images or text, Also you can create bouncing text/images, slide in images, slow and/or fast scrolling and much more. 

So let see how to scrolling images and text in blogger blog or other web sites by using marquee tag.
<marquee ……… </marquee>, that is the basic marquee tag code. By written more Attributes into that code we can customize our marquee tag as we wish.

Below are some attributes that help to do more customization of our marquee tag.

Behavior
Sets how the text or image is scrolled within the marquee. Most possible values are scroll, slide and alternate. If there are no value is specified, the default value is scroll.

bgcolor
Sets the background color through color name or hexadecimal value of the marquee.

direction
Sets the direction of the scrolling of image or text within the marquee. Possible values are left, right, up and down. If there are no value is specified, the default value is left.

width   
Sets the width in pixels or percentage value of the marquee.

height
Sets the height in pixels or percentage value of the marquee.

hspace
Sets the horizontal margin around the marquee.

loop
Sets the number of times the marquee will scroll. If there is no value is specified the default value is -1, which means the marquee will scroll continuously.

scrollamount
Sets how far to jump as it moves. That sets the amount of scrolling at each interval in pixels. If there are no value is specified, The default value is 6.

scrolldelay
Sets How long the marquee should wait before each jump? That sets the interval between each scroll movement in milliseconds. If there are no value is specified, the default value is 85.
          * Any value smaller than 60 is ignored and the value 60 is used instead, unless truespeed is specified.

truespeed
By default, scrolldelay values lower than 60 are ignored. If truespeed is present, those values are not ignored.

vspace
Sets the vertical margin in pixels or percentage value around the marquee.


below the example of customize marquee code.


<marquee direction="right" width="250" height="200" style="border:solid">Hi There! Your scrolling text here</marquee>

Below are some marquee tag codes with live demo.

Let see how to add scrolling images in blogger or how to add marquee tag into  blogger blog?


        1.   Log into your Blogger blog account -->> Go to Dashboard __>> new post  __>> click on HTML tab to open Html mode __>> copy paste your marquee code -->> Publish

                       or

      2.   Log into your Blogger blog account -->> Go to Dashboard __>> Layout __>> Add widget -->> HTML/Java Script   __>> copy paste your marquee code  __>> Save



Scrolling Text

Scroll from left to right


<marquee direction="right" >Hi There! Your scrolling text here</marquee>
Hi There! Your scrolling text here

 


Scroll alternatively. With attribute behavior that bouncing back and forth.


<marquee behavior="alternate" >Hi There! Your scrolling text here</marquee>

Hi There! Your scrolling text here




Continuous scrolling.


<marquee behavior="scroll" direction="left" >Hi There! Your scrolling text here</marquee>

Hi There! Your scrolling text here



Scrolling upwords


<marquee direction="up" >Hi There! Your scrolling text here</marquee>

Hi There! Your scrolling text here



 Scrolling dawnwords.


<marquee direction="down" width="250" height="200" style="border:solid">Hi There! Your scrolling text here</marquee>

Hi There! Your scrolling text here



Scrolling from the top down alternative that bouncing up and dawn.


<marquee direction="up" behavior="alternate" width="250" height="200" style="border:solid">Hi There! Your scrolling text here</marquee>

Hi There! Your scrolling text here



Bouncing text


<marquee direction="down" width="250" height="200" behavior="alternate" style="border:solid">
 <marquee behavior="alternate">
    Hi There! Your scrolling text will bounce
  </marquee>
</marquee>

Hi There! Your scrolling text will bounce



Change the Scrolling speed


<marquee behavior="scroll" direction="left" scrollamount="1">Hi There! Slow scroll speed text here</marquee>
<marquee behavior="scroll" direction="left" scrollamount="10">Hi There! Medium scroll speed text here</marquee>
<marquee behavior="scroll" direction="left" scrollamount="20">Hi There! Fast scroll speed text here</marquee>

Hi There! Slow scroll speed text here Hi There! Medium scroll speed text here Hi There! Fast scroll speed text here



On a Background


<font color="WHITE"><marquee direction="left" style="background:RED">TEXT</marquee></font>
<marquee style="border:RED 3px SOLID">TEXT</marquee>

TEXT TEXT




Scrolling images



Scrolling both images and Texts

<marquee>Your scrolling text here<img src="YOUR-IMAGE-URL-HERE" ></marquee>

Your scrolling text here 




Scrolling left

<marquee behavior="scroll" direction="left" >
<img src=" YOUR-IMAGE-URL-HERE "  >
</marquee>


<marquee direction="left">
<img src=" YOUR-IMAGE-URL-HERE "/>
<img src=" YOUR-IMAGE-URL-HERE "/>
</marquee>





Scrolling up

<marquee direction="up">
<img src=" YOUR-IMAGE-URL-HERE "/>
</marquee>





There are few number of marquee codes. You can customize that codes as you wish.

By using that scrolling/<marquee> tags you can easily build up  simple news ticker bar into blogger blog
So. I think now you have a better understand about how to add scrolling images in blogger or other web sites by using marquee tag. You can use that code for images as well as texts.



For more reading THEWONDERSPOT







Thank you for reading - How to add scrolling images, text into blogger? marquee tag.
Good Luck.

tags- How to add scrolling texts or images into blogger blog by using marquee tag
How to use using marquee tag

Don’t forgot to Subscribe us to get latest news letters and give your feedback in below comment section ;-) ;-)

Post a Comment

0 Comments