Add Top Stylish Recent Comment Widgets with Hover Effect

Add Top Stylish Recent Comment Widgets with Hover Effect .this widget is the top blogger template and important blogger templates also . this widget you will give a hover effect on blogger .and in this widget will you give any no of comments  .this is a touch mouse cursor animated one in blogger comment widget .this is the top blogger comment widget i will show on below code on 6 comment you will edit maximum 10 comments you will be add on this widget on easily .a have been above posted on another widget for blogger is

Awesome Rounding Related Post widget With Thumbnails for Blogger in one another widget is Attractive style social Profile widget on blogger blog

             HOW TO ADD THIS WIDGET ON BLOG

• LOG ON BLOGGER
• CLICK DROP DOWN MENU
• THEN PRESS LAY OUT
• SELECT ADD  GADGET
• BELOW CODE YOU PASTE IT

<style type="text/css"> WORLDAJITH.BLOGSPOT.IN_recent_comments { list-style: none; margin: 0; padding: 0; } .bh_recent_comments li { background: none!important; margin: 5px!important; padding: 5px!important; display: block; clear: both; overflow: hidden; list-style: none; } .bh_recent_comments li .avatarImage { padding: 3px; background: #fefefe; -webkit-box-shadow: 0 1px 1px #ccc; -moz-box-shadow: 0 1px 1px #ccc; box-shadow: 0 1px 1px #ccc; float: left; margin: 0 6px 0 0; position: relative; overflow: hidden; } .avatarRound { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } .bh_recent_comments li img { padding: 0; position: relative; overflow: hidden; display: block; } .bh_recent_comments li span { margin-top: 3px; color: #666; display: block; font-size: 12px; line-height: 1.4; } .bh_recent_comments li { -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; transition: .5s; border: 2px solid transparent; } .bh_recent_comments li:hover { -webkit-transform: scale(1.2) translate(15px); -moz-transform: scale(1.2) translate(15px); -ms-transform: scale(1.2) translate(15px); -o-transform: scale(1.2) translate(15px); transform: scale(1.2) translate(15px); box-shadow: 0 0 20px 1px #aaa; } </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 5, showAvatar = true, avatarSize = 45, roundAvatar = true, characters = 40, showMorelink = false, moreLinktext = "More ?", defaultAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhawyzmjQnmavCiQhsCLh4W6NucDcrvOWRTbqnGh_uAdvMJqmvGPUH6KNOsZpXV8yUqLCSV3uY1wmSl8P_XrDFYIS7UeR3UdQrZY9fJp_A4CsywfaZYGteCWmmouce5oLMSvtidtnmlmMhl/s1600/blogger-avatar-1.png", hideCredits = true; //]]> </script> <script type="text/javascript" src="http://dl.dropbox.com/u/81212926/bloggerheroe-recent%3Dcomments.js"></script> <script type="text/javascript" src="/feeds/comments/default?alt=json&callback=bh_recent_comments&max-results=5"></script>

• NOW YOU WILL SAVE THEM ONE BELOW BUTTON

                                                         NOW YOU WILL FINISH ALL THE STEPS
                                                                                                                    HAPPY BLOGGING