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

In case you have a lot of links in your blog's BlogRoll, or if you want to show all your favorite books list, but have limited space in the sidebar the 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 after removing the mouse-cursor 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 format to enter the content 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 adjust or modify the colored content, so as to suit your choice or blog.

Example Of Marquee with IMAGE

<div class="textwidget"><marquee direction="up" width="300" onmouseover="this.stop()" scrollamount="2" onmouseout="this.start()" height="200" align="center">

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjotE8j0jPdL3ZQU-NgKvUq40unBkeTEhNUt2SySzkcQW0IsGzyIKpzapSuXWrvpMoaIYNw39Rl4eHV3HAsdwsda4naiX7tDmIoZSI6EUNGiB8r65bjk_9BS_gVuCxeVtvplEt-HKBwk_U/s250/camera.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDk99fXwVTf3dwI9MD9r13tZTlQ56TEYic3jW48eHD2LNmhTX6k4MynVF_Nb3ySdrvV3lBXzfc23kblEWdpZIOMDk9cTpIltdIkG4jtuw9-T73Xvahp9Es5ZTl5gNa1GKRgphzRnsMmZU/s250/camera7.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixlPHpYpBpfRgfLD-G51xiZZQ4z9EkGqwMbOSMNcJqDJjYoeQfIwOpSQ4OOIG6Vcjjt7OVR7ZI5M9HE-o7Ar4uAANXqdMX61R0_j6e2ai3MAl0Yi7tE5RNsHWqirBDTLd9IUUFMDYTDyM/s250/camera6.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp-UYwhF5MSfnpOtySUXbMXjlGFl5o6Rl7yHzd4QOIjgxhNAkdcEwXgdABwF2aQ3BEhpO9a3VDzUa3dL250tYmdZKtoAM7sohyphenhyphend-k9tfBn_gBDKgWYE31mPm9RqzPABou8W47-8hHYcLE/s250/camera5.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMJ1AWOqTv0oRHwZbQlIAI3Zt_tzYXFUX06I11LVR4GPFvWiLqleaX2Kx-l-tOfKYi7kf2aA1cXKFrq33Uxq9M-tJ8srHaA1E_wt7XQ78M2EFkiGyTKk3PAQxUhMbI-ktFsOU6I0nTxWM/s250/camera4.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPbfQxrwh-brTDt1lW9y1xpxtCu6twTKJZ5BAS_p8C6MTWbjzOBopRvScUejp5wPKPuCdPgpliYXHMGBMr9u9pj-Q9kBuAab8yi4lfRxf-4fHrMflr1-uanj18jSXA6caqyte-x6WreJE/s250/camera3.jpg.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqqtR8SmWHOFDafwat-SWvb7HRpHNly426qKe6iHxq0v1e4LhEPXjKn9XQLYxyvjFYE6gRAr_AjUWbcTn9hnH4zMCh7oKlevbHZFklzasEzn9k8DAv13WMENxMPjlQbHfs3qm6j1_AoE8/s250/camera2.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

<p>Welcome to Our Blog.</p>

<div style='clear:both;height:30px;'/>

<a href="" rel="nofollow"><img border="0" alt="AD DESCRIPTION" width="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMCuSqPzzYFEoILZIAfMF4GS_YPZk0HPLMlXn8qgqRIAv-xuS_WyhyLNny5GMvyPvAFdvPl7iCioTjFW1o2VEMAWwM6bm8nKJN1cc3JJLjfvGjhvp-MIjkSm2FtzUkUKzLHYqmCt8T4v0/s250/camera1.jpg" height="250"/><div style='clear:both;height:30px;'/></div></a>

</div></div></div></div></div></div></div></div></marquee></div>

End of Marquee with IMAGE

And You can put some linked/unLinked images too:

Featured Posts
Next Gen Computers 500 GB Disks  Flash Drives  Mobile Phones

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 Computers 500 GB Disks Flash Drives Mobile Phones

---