Tuesday, November 20, 2018

Back To Top Button Blogger Blog


More Topics:

In this post, we are going to share Back To Top Button for Blogger Blog that helps to scroll on top from bottom directly on the single click. Follow the steps below to add Back To Top Button on Blogger Blog.
Add Back To Top Button for Blogger Blogspot Blog


Back To Top Button Blogger Blog


1. Login your Blogger Dashboard
2. Click on Layout Tab
3. Click on Add Gadget (any).
4. Select HTML/JavaScript Gadget.
5. Leave blank for the title and Copy the whole code and paste on the content area.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
jQuery(document).ready(function() {
var offset = 300;
var duration = 500;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('.backtotop').fadeIn(duration);
} else {
jQuery('.backtotop').fadeOut(duration);
}
});

jQuery('.backtotop').click(function(event) {
event.preventDefault();
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
})
});
</script>

<a href="#" class="backtotop">Back To Top</a>
<style>
.backtotop {
position: fixed;
bottom: 10px; /* increase value to move position up */
right: 0px; /* increase value to move position left */
color: #000000; /* color of text */
background-color: #ffffff; /* background color of button */
font-size: 12px; /* changes size of text */
padding: 10px; /* add space around the text */
text-transform: uppercase; /* change text to all caps */
letter-spacing: 1.0px; /* space between letters */
}

.backtotop:hover {
background-color: #333333; /* color of background on hover over */
color: #ffffff; /* color of text on hover over */
text-decoration: none; /* no underline */
}
</style>
6. Click on Save and You're done. Check your blog.





Author:

Hi, I am Rupak. Part time blogger, gamer, youtuber. Read More

2 comments:

  1. Dear Rupakji,

    In my all post on blogger, always post title comes - Latest News, Breaking news, Current Affairs and GK, according to my post title for example : https://www.dailyradiogk.com/2019/07/lok-sabha-passes-arbitration-bill-new.html

    actually, i am not finding write word for actual problem, if you understand, please help me.

    ReplyDelete
    Replies
    1. Actually I don't understand what you want to tell !!! Can you clear in details?

      Delete

Dear Readers,

Please note that,

1. All comments are moderated before publishing them.

2. Comments deemed to be spam or questionable spam, including profanity and containing language or concepts that could be deemed offensive will be deleted.

3. Including a link to relevant content is permitted, but comments should be relevant to the post topic.