Scroll/Back to top Blogger widget based on JQuery

Blogger users growing up every day. Blogger is a simple for use and easy to customize. Also, it's giving a free unlimited hosting. You can add a JS code to your blog to give effects to it. And in this post, I will give you a code of JQuery based scroll button widget. 

1) First of all go to blogger and after to Layout.
2) Now click on "Add a new Gadget" button.
3) And add this code:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script><script type="text/javascript">$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$("#top").fadeIn()}else{$("#top").fadeOut()}});$("#top").click(function(){$("body,html").animate({scrollTop:0},800);return false})});</script>
<a href="https://www.blogger.com/null" id="top" style="bottom: 1px; cursor: pointer; display: none; font: 12px arial; position: fixed; right: 0%;"><img src="http://lh3.googleusercontent.com/-uaO-GjCMRHY/U9FN4YarXMI/AAAAAAAAKUY/1mXlAMwFpwk/s43-no/Back To Top.png" height="43px" width="43px" /></a>

Now to change the image of scroll widget, you need to replace the default image link with new image link: 

http://lh3.googleusercontent.com/-uaO-GjCMRHY/U9FN4YarXMI/AAAAAAAAKUY/1mXlAMwFpwk/s43-no/Back To Top.png

To change the height and width of image change the values of width="43px" height="43px"

Now save the widget and enjoy!