
This tutorial is for you to add a back to top button easily in your blog or website. The steps to add this button are given below:
1. Open your website / blog's HTML and paste the following code just above the </body> tag
2. OPTIONAL: You can change the red code with your own image URL.<!--BACK2TOP-IMAGE-STARTS-TECHMODULES.BLOGSPOT.COM--><a alt="Back to Top" style="display:scroll;position:fixed;bottom:25px;left:5px;" href="#" title="Back to Top"><img onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0otq9AroZVkirnly4gopxD-vtXIuERRtSjVoebV5eLCB1lqY4Tf4dUm8ijPdyfO9Y4Hlat2H3UWrTwUzYH42CEVih-wkJf80MoR66rjjFnV8hMSZ_9MRNAOO9Vzn1MSGHRS2CbhYpKQw/s1600/Back2Top_2.jpg'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmnmofH6RZBe2qSOdctP4GiNqX9jRgb1M7JNSfOIg-qEVWjakfF86aBPVHBaVbQtYHsmN9eoY4vbDBg0tbZu3CsKfhQq8ppzqC35Fm2d6fdXQT-8E_YE3DhckP5RuOAHq3OpiwbjH2ilw/s1600/B2T_Small.jpg" onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmnmofH6RZBe2qSOdctP4GiNqX9jRgb1M7JNSfOIg-qEVWjakfF86aBPVHBaVbQtYHsmN9eoY4vbDBg0tbZu3CsKfhQq8ppzqC35Fm2d6fdXQT-8E_YE3DhckP5RuOAHq3OpiwbjH2ilw/s1600/B2T_Small.jpg'" /></a><!--BACK2TOP-IMAGE-STOPS-TECHMODULES.BLOGSPOT.COM-->
You have done it. Now refresh your website to check the button.
Features:
- Fixed position on the page
- Easy customization
- Zoom effect on mouse over
- No effect on page loading speed
Note: Please give your comments about this article with the comment form below.
great blog will be trying out these on my blog.
ReplyDeleteThey will surely help a lot.Thanks a lot ! Would definitely try out in my blog also.
ReplyDeleteweb design company