Cool Animated Scrolling Recent Posts Widget for Blogger

Live Demo

Add Cool Animated Scrolling Recent Posts Widget for Blogger

1. Go To the Layout and Follow the following steps:

"Add Gadget >> HTML/Java script"

2. Add the following code in "HTML/Java Script"

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script><style type="text/css" media="screen"><!--#easytins {overflow:hidden;margin-top:5px;padding:0px 0px;height:350px;}#easytins ul{width:220px;overflow:hidden;list-style-type: none;padding: 0px 0px;margin:0px 0px;}#easytins li {width:208px;padding: 5px 5px;margin:0px 0px 5px 0px;list-style-type:none;float:none;height:70px;overflow: hidden;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnnYLdRA5zavJ5G2v0k-KxEFdz_Ery5bq9sXMm7PvptHAXzU6QtIJ42YZ1d3w9JrYDP5A979NZo3vGafmUmZe4k-0PfHm8m-XvL3DJM7u4P4qaF0OppFqxT_Su1U48IbaLqwgDpGOL6f23/s1600/easytins-com.jpg) repeat-x;border:1px solid #ddd;}#easytins li a {text-decoration:none;color:#4B545B;font-size:11px;height:18px;overflow:hidden;margin:0px 0px;padding:0px 0px 2px 0px;}#easytins li img {float:left;margin-right:5px;background:#EFEFEF;border:0;}.spydate{overflow:hidden;font-size:10px;color:#0284C2;padding:2px 0px;margin:1px 0px 0px 0px;height:15px;font-family:Tahoma,Arial,verdana, sans-serif;}.spycomment{overflow:hidden;font-family:Tahoma,Arial,verdana, sans-serif;font-size:10px;color:#262B2F;padding:0px 0px;margin:0px 0px;}--></style><script language='JavaScript'> imgr = new Array();imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW7h3DZg77vohh3rc6kH9j2qZeuYov5w_um-FiznMPxTN7jrIeH_Zt_bF4xwJkAv51GiwqXGWj2s4TCIgae1qOsNcaf-DXX7ZWwb0wPcGdG4AUkDDZkC0F_RjpJHoUCxH-ltuGS2cqaXRL/s1600/no+image.png";imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW7h3DZg77vohh3rc6kH9j2qZeuYov5w_um-FiznMPxTN7jrIeH_Zt_bF4xwJkAv51GiwqXGWj2s4TCIgae1qOsNcaf-DXX7ZWwb0wPcGdG4AUkDDZkC0F_RjpJHoUCxH-ltuGS2cqaXRL/s1600/no+image.png";imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW7h3DZg77vohh3rc6kH9j2qZeuYov5w_um-FiznMPxTN7jrIeH_Zt_bF4xwJkAv51GiwqXGWj2s4TCIgae1qOsNcaf-DXX7ZWwb0wPcGdG4AUkDDZkC0F_RjpJHoUCxH-ltuGS2cqaXRL/s1600/no+image.png";imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW7h3DZg77vohh3rc6kH9j2qZeuYov5w_um-FiznMPxTN7jrIeH_Zt_bF4xwJkAv51GiwqXGWj2s4TCIgae1qOsNcaf-DXX7ZWwb0wPcGdG4AUkDDZkC0F_RjpJHoUCxH-ltuGS2cqaXRL/s1600/no+image.png";imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW7h3DZg77vohh3rc6kH9j2qZeuYov5w_um-FiznMPxTN7jrIeH_Zt_bF4xwJkAv51GiwqXGWj2s4TCIgae1qOsNcaf-DXX7ZWwb0wPcGdG4AUkDDZkC0F_RjpJHoUCxH-ltuGS2cqaXRL/s1600/no+image.png";showRandomImg = true;boxwidth = 300;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 70;thumbheight = 70;fntsize = 12;acolor = "#666";aBold = true;icon = " ";text = "comments";showPostDate = true;summaryPost = 40;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";numposts = 10;
home_page = "enter your homepage url";
limitspy=4intervalspy=4000</script><div id="easytins"><script src='https://ugwoke-charles-jsfiles.googlecode.com/svn/trunk/anim-rec-post.js' type='text/javascript'></script>

 3. Enter url of your site in the followin box home_page = "enter your homepage url here";

4. Change the number of post from following line numposts = 10;

5. Change scrolling speed by following line intervalspy=4000

6. Change box width by following line  boxwidth = 300;

7. Enjoy the widget and post your reviews...

Related Post