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/AVvXsEisTk4LtWsV57D7GC-izEzqus5h5IOql5CtXDvkM08iLd8MMY0HSgPlV4l4zOJyaF6jdlUgNkMo4BUYktgx6X27uRL0BC9lHnXneTTRBadZnsAuXJOzgyL84ea_8VlfaFnin3J2nOgT9mI/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 alt="Back to Top" data-src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisTk4LtWsV57D7GC-izEzqus5h5IOql5CtXDvkM08iLd8MMY0HSgPlV4l4zOJyaF6jdlUgNkMo4BUYktgx6X27uRL0BC9lHnXneTTRBadZnsAuXJOzgyL84ea_8VlfaFnin3J2nOgT9mI/s1600/go+to+top+button.jpg" ></a>

<!--ABT End-->

Browse More Articles

Tweet

Written by Blogging Tips

We are Creative Blogger Theme Wavers which provides user friendly, effective and easy to use themes. Each support has free and providing HD support screen casting.