Smooth Scrolling Go to top button For Blogger/Blogspot

q

Today I am giving a tutorial about How to add smooth scrolling go to top button with jquery. This plugin the Scrolling Starts from bottom with a Certain speed and it Ends with Gradually Decreases the speed. this effect is looks more attractive.

Installing the plugin - 


Here are two simple steps to install this widget - 

Step 1: Adding Jquery JavaScript Plugin(Ignore this step if your blog have already a Jquery Plugin)

1. Go to Blogger Dashboard > Design tab > Edit Html
2. Search for </head> tag
3. Add below line of code Before </head> tag

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>

Step 2: Adding Scroll to Top Script

1. Go to Blogger Dashboard > Design tab > Edit Html
2. Search for </head> tag
3. Add below section of code Before </head> tag and Save your Template.

<style type="text/css">
#w2btoTop {display:none;text-decoration:none;position:fixed;bottom:10px;right:10px;overflow:hidden;width:51px;height:51px;border:none;text-indent:-999px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSbdeEBRKViYAtEnUrqfSaK_aVk61V0rFSU-t7JMj4Fa-T6tApAVeiOPxM7akM6CX6Gcjw3lRsB5OZQ5M1dfCsfnaWCtOEuSax3Nq_RhASzq8cV1r7KEuw_JrHOkOaBHQ1cDaweArhf5as/) no-repeat left top;}
#w2btoTopHover {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSbdeEBRKViYAtEnUrqfSaK_aVk61V0rFSU-t7JMj4Fa-T6tApAVeiOPxM7akM6CX6Gcjw3lRsB5OZQ5M1dfCsfnaWCtOEuSax3Nq_RhASzq8cV1r7KEuw_JrHOkOaBHQ1cDaweArhf5as/) no-repeat left -51px;width:51px;height:51px;display:block;overflow:hidden;float:left;opacity: 0;-moz-opacity: 0;filter:alpha(opacity=0);}
#w2btoTop:active, #w2btoTop:focus {outline:none;}
</style>
<script src="http://bloggerblogwidgets.googlecode.com/files/w2b_jquery.ui.totop.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){ $().UItoTop({ easingType: 'easeOutCirc' }); });
</script>

Save your template and reload your blog page to see changes.
Leave your comments about this widget....
Thanks to Way2Blogging.org Author - Harish...

View Demo