This Post will help you to add a Scroll To Top function in your Blogger Blog. Follow the steps given below.
DEMO
1 - Go to Blogger -> Template -> Edit HTML
2 - Adding Codes.
Add this script before </head> if you havent added a script src of Jquery Library.
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>Add this Code before </head> tag.
<script>$(document).ready(function(){$("body").append("<p id=back-top style=display: block; ><a href=#top><span/>Back to Top</a></p>"); $("#back-top").hide(); $(function () {$(window).scroll(function () {if ($(this).scrollTop() > 100) {$('#back-top').fadeIn(); }else {$('#back-top').fadeOut(); }});$('#back-top a').click(function () {$('body,html').animate({scrollTop: 0 }, 800); return false; }); });});</script>Add this CSS Style sheet code before </head>
<style>#back-top { position: fixed; bottom: 30px;right:0px;}#back-top a { width: 108px; display: block; text-align: center; font: 11px/100% Arial, Helvetica, sans-serif; text-transform: uppercase; text-decoration: none; color: #bbb; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s;}#back-top a:hover { color: #000;}#back-top span { width: 108px; height: 108px; display: block; margin-bottom: 7px; background: #ddd url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrrYc-98yJ_6X3kiDum2dgwaT-TGJiXGOrMyZkbC-s8Vmq_1fw_RY1yxCEKbEmWtYCHiw-do3Qr9yaer5NYbh3lMFswTfBAlIyI-aX2KPD-uNcq581FljaOKoa5B_iIOPX-74zzWxxIRE/s1600/0017.png') no-repeat center center; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s;}#back-top a:hover span{background-color: #777;}</style>No need of adding any HTML element because the Jquery script is adding the HTML element in BODY tag.
alternative link download