smooth scrolling back to top button for blogger

Soft smooth back to top button for blogger add below given code in your blog for show Scroll back to top button in bottom of right side by pressing this button page will be reach top in the page. You can replace https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOn7j0w2AKu1Pt_RW9ClvXRd4E4_SjOhz5LlP1VdDdiwvIOB_2-MYhOWokl_KGmlIFBW8X13tAku8CQpV1en4WB-tpALcWKsgNmLZS-3PbfgcdAm7-C4G7PuoHZsXz2btRIp8IAU_7WvU/s1600/go+to+top+button.jpg this image url with your favorite image as a back to top button image in below given code.so let try smooth back to top button in your blogger.
Add below given code in your blogger blog as a widget by HTML/JAVASCRIPT widget.


<!--ABT Start--> <script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script> <script> jQuery(document).ready(function() { var offset = 220; var duration = 500; jQuery(window).scroll(function() { if (jQuery(this).scrollTop() > offset) { jQuery('.back-to-top').fadeIn(duration); } else { jQuery('.back-to-top').fadeOut(duration); } }); jQuery('.back-to-top').click(function(event) { event.preventDefault(); jQuery('html, body').animate({scrollTop: 0}, duration); return false; }) }); </script> <style> div#page { max-width: 900px; margin-left: auto; margin-right: auto; padding: 20px; } .back-to-top { position: fixed; bottom: 2em; right: 0px; text-decoration: none; color: #000000; background-color: rgba(235, 235, 235, 0.80); font-size: 12px; padding: 1em; display: none; } .back-to-top:hover { text-decoration: none; } </style> <a href="#" class="back-to-top"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOn7j0w2AKu1Pt_RW9ClvXRd4E4_SjOhz5LlP1VdDdiwvIOB_2-MYhOWokl_KGmlIFBW8X13tAku8CQpV1en4WB-tpALcWKsgNmLZS-3PbfgcdAm7-C4G7PuoHZsXz2btRIp8IAU_7WvU/s1600/go+to+top+button.jpg" alt="Back to Top" / ></a> <!--ABT End-->