Hello Visitors, today sharing a trick to add a back to top button with smooth jQuery effect. This widget will allow your readers/visitors to move back to the top of your blog with just a single click and it appears when readers scroll downward.
We created this button in different style, what you just need to do is to choose from the varieties of the buttons that best suit your blog.
How To Add The Back To Top Button:
Go to Blogger Dashboard
Click on "Design" > "Page Elements" > "Add a Gadget"
Choose "HTML/JavaScript" from the list of the gadgets
Copy and paste the code below in the content box and click "Save"
Choose from the list of buttons below and replace BUTTON URL with the url of the button you decide to choose.
To change the position of the button, edit right and replace it with left if you decide to position it in left direction.
To change the size of the button, simply edit width="30px" and height="30px"
We created this button in different style, what you just need to do is to choose from the varieties of the buttons that best suit your blog.
How To Add The Back To Top Button:
Go to Blogger Dashboard
Click on "Design" > "Page Elements" > "Add a Gadget"
Choose "HTML/JavaScript" from the list of the gadgets
Copy and paste the code below in the content box and click "Save"
<!-- Tipsfollowers back to top widget Start--><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script><script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$("#rb-top").fadeIn()}else{$("#rb-top").fadeOut()}});$("#rb-top").click(function(){$("body,html").animate({scrollTop:0},800);return false})});</script><a href="http://tisfollowers.blogspot.com"></a><a id='rb-top' style='display: none; position: fixed; bottom: 1px; right:0%; cursor:pointer;font:12px arial;'><img src='BUTTON URL' width="30px" height="30px"/></a><!--Tipsfollowers back to top widget End-->
Choose from the list of buttons below and replace BUTTON URL with the url of the button you decide to choose.
To change the position of the button, edit right and replace it with left if you decide to position it in left direction.
To change the size of the button, simply edit width="30px" and height="30px"
0 comments:
Post a Comment