Auto-Scrolling [Text Or Image Slide Shows] Widgets For BlogSpot / Blogger Blogs

In case you have a lot of links in your blog’s BlogRoll or if you want to show all your favorite books list on the sidebar, but have limited space in it then this widget will be a great help for you !

You can put as many links/ listed items as you want in this widget, they will scrolling automatically unless the visitors hovers the mouse cursor on the widget, and as long as the cursor is placed on over the widget, the scrolling will be paused, and it will only resume once the mouse-cursor is removed from the widget.

It will be displayed like this:

BlogRoll
LINE OR IMAGE 1
LINE OR IMAGE 2
LINE OR IMAGE 3
LINE OR IMAGE 4
LINE OR IMAGE 5
ETC.

Here’s the simple procedure of adding the widget to your blog:
Log in to Blogger
Go to Layout section, and click on “Add a Gadget“, select as “HTML/JavaScript

Now this is the code to paste in to the widget:

<div class=”textwidget”>
<marquee direction=”up” width=”105″ onmouseover=”this.stop()” scrollamount=”2″ onmouseout=”this.start()” height=”200″ align=”left”>
LINE OR IMAGE 1
LINE OR IMAGE 2
LINE OR IMAGE 3
LINE OR IMAGE 4
LINE OR IMAGE 5
ETC.
</marquee></div>

NOTE: You can change or modify the highlighted code (in RED and BLUE), so as to suit your choice or blog.

You can also use hyperlinking for the images:

Featured Posts

Or you can even use a simpler version of this code:

<marquee behavior="scroll"direction="left">
<img src="http://path_to_your_image.jpg/" alt="Title of image" height="Height of image" width="Width of image" />
<img src="http://path_to_your_image.jpg/" alt="Title of image" height="Height of image" width="Width of image" />
<img src="http://path_to_your_image.jpg/" alt="Title of image" height="Height of image" width="Width of image" />

<img src="http://path_to_your_image.jpg/" alt="Title of image" height="Height of image" width="Width of image" />
</marquee>

And it will be displayed like this:

Next Gen ComputersNext Gen Computers 500GB on a Disk500 GB Disks Amazing Flash DrivesFlash Drives History Of Mobile PhonesMobile Phones

Leave a Reply

113 Comments on "Auto-Scrolling [Text Or Image Slide Shows] Widgets For BlogSpot / Blogger Blogs"

Notify of
avatar
Sort by:   newest | oldest | most voted
Margot
Guest

I used your links and the vertical one worked great but the horizontal one isn’t working right. I have several lines of scrolling buttons instead of just one. Here is my blog url
http://shelterednotshatteredblogroll.blogspot.com/
I’d appreciate any help you could give. I also linked to you from my Home blog because I had several people asking how I got the scrolling box up.

View Comment
Divya Sai
Guest

Hello Margot, when I checked your blog, I found the horizontal banners scrolling in proper manner. If you want to display them inside a box(of fixed length), then use this code:

<table border="1" width="200"><tr>
<td>THE ABOVE CODE FROM THE POST HERE</td>
</tr></table>

View Comment
Sherrie
Guest

How do I delete a space that shows up b/t some of the links??? TIA!

http://www.childresshousehold.blogspot.com

View Comment
Divya Sai
Guest

Hi Sherrie

Can u explain exactly about which space are you talking about(can u show any example of it, as I am unable to understand your problem)…

View Comment
Sherrie
Guest

If you go check out my blog (http://www.childresshouseholdblogspot.com) there are some spaces b/t some of the buttons. For instance, I think there’s one above Red Sox Mommy. That’s just one. If you watch the scroll, you’ll see more. Make sense? TIA!

View Comment
Divya Sai
Guest

I couldn’t see any text “Red sox mommy”, what i could see is a widget with two banners scrolling upwards (with heading praying for harper)… and another widget with heading awards
Can you tell me where exactly is the widget you are talking about ?

View Comment
Sherrie
Guest
Sorry, it’s the first one that has the “praying for Harper” button. What I’m referring to is that there appears to be spaces between some of the buttons within that scrolling widget. If you watch the widget that has the “praying for Harper” button, you will notice a space (gap) in between some of the buttons (images). For instance, there’s a space b/t the “on the Verge” button and the “Red Sox Mommy” button. There’s also more spaces if you keep watching. Thanks again. I don’t mean to be a bother, but I just don’t know how to get rid… Read more »
Divya Sai
Guest

Ohk….

I checked the source code of your blog, in the widget between the image banners(buttons) you will find these codes:

<br/>

just delete them…that's it
and don't worry you are not bothering me….feel free to ask your queries here…

Regards
Sai

View Comment
Sherrie
Guest

Thanks. I’ll work on that. Didn’t realize it was that simple of a fix! LOL! I finally got my favicon to work in IE! YEAH!

View Comment
Divya Sai
Guest

good to hear that ! 🙂

View Comment
Felicia F. Ramzi
Guest

i cant get the links to work..

View Comment
Divya Sai
Guest

Which one are you talking about?

View Comment
nourfadly80
Guest

Nice code…but sometimes it doesnt scroll the whole image on it…maybe my pc lagging? or its fine in your view…thanks anyway for the code..now i can simplify things in my blog 🙂

View Comment
Divya Sai
Guest

Hi nourfadly80

We are using “marquees” in this hack, which may have some issues with certain browsers, but that is very rare, although we can use javascripts for this, but that will slow down your blog’s loading, and it will not work in PC’s without javascripts installed.
So do not worry, I have visited your blog, and found the widget in the perfect working condition….

Regards
Sai

View Comment
PrissyGreen
Guest

hi there. I have several more links besides the 2 1/2 that are showing up, at least 10 more. I can’t figure out why they aren’t all showing up?

do mind offering some assistance? thank you so much in advance!
http://prissygreen.blogspot.com

View Comment
Divya Sai
Guest

Hi PrissyGreen,

I visited your blog, and found the widget working exactly as it should be, all the link banners are rolling perfectly, so I think you have done the troubleshooting yourself !
BTW you have a nice blog ! Keep up the good work !

Regards
Sai

View Comment
CrakerLo
Guest

erm, how… to make a “only-3-sliding-image, with bigger, show numbers (or not) slide down then go back up and go back down” slide?
like http://www.grandchase.com.tw or grandchase.ntreev.net tis 2 web are example could u teach me? or if u cnt then nvm

View Comment
Divya Sai
Guest

Hi crakerlo,
those are not simple marquee codes, but includes javacsript and css coding too, not very difficult, but will take some time, I can reply you regarding this after 2 days,
can you plz reply here or mail me after 2 days!

Regards
Sai

View Comment
CrakerLo
Guest

oooo!!!! TY DIVYA!!!!! here’s my email
craker555@hotmail.com or craker_lo@hotmail.com
ty divya ty!!!

View Comment
CrakerLo
Guest

so u’re done yet? i can wait jz scare u 4gt
-CrakerLo-

View Comment
wpDiscuz