HOW TO MADE A "SCROLL TO TOP" BUTTON TO BLOGGER

HOW TO CREATE "SCROLL TO TOP" BUTTON TO BLOGGER

How To Create "Scroll to Top" Button To Blogger?

1. Go to Blogger Dashboard > Template
2. Download a copy of your template
3. Click on Edit HTML
4. Hit Proceed button
5. Find below code in your template
]]></b:skin>

6. Now add below CSS code before ]]></b:skin> tag .

/* to top */
#toTop { width:100px;background:#F4FFBF;border:1px solid #ccc;text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-decoration:none; }


7. Now add below code before </body> tag:


<A HREF="#" ID="TOTOP">^ SCROLL TO TOP</A>
<SCRIPT SRC='HTTP://AJAX.GOOGLEAPIS.COM/AJAX/LIBS/JQUERY/1.3.2/JQUERY.MIN.JS' TYPE='TEXT/JAVASCRIPT'></SCRIPT>
<SCRIPT TYPE='TEXT/JAVASCRIPT'>
/*-----------------------
* JQUERY PLUGIN: SCROLL TO TOP
* BY CRAIG WILSON, PH.CREATIVE (HTTP://WWW.PH-CREATIVE.COM)
* BRING TO YOU BY ZEN FROM HTTP://ZENPLATE.BLOGSPOT.COM
* COPYRIGHT (C) 2009 PH.CREATIVE LTD.
* DESCRIPTION: ADDS AN UNOBTRUSIVE "SCROLL TO TOP" LINK TO YOUR PAGE WITH SMOOTH SCROLLING.
* FOR USAGE INSTRUCTIONS AND VERSION UPDATES TO GO HTTP://BLOG.PH-CREATIVE.COM/POST/JQUERY-PLUGIN-SCROLL-TO-TOP.ASPX
* DO NOT DELETE THESE INFOMATION
* VERSION: 1.0, 12/03/2009
-----------------------*/

$(FUNCTION(){$.FN.SCROLLTOTOP=FUNCTION(){$(THIS).HIDE().REMOVEATTR("HREF");IF($(WINDOW).SCROLLTOP()!="0"){$(THIS).FADEIN("SLOW")}VAR SCROLLDIV=$(THIS);$(WINDOW).SCROLL(FUNCTION(){IF($(WINDOW).SCROLLTOP()=="0"){$(SCROLLDIV).FADEOUT("SLOW")}ELSE{$(SCROLLDIV).FADEIN("SLOW")}});$(THIS).CLICK(FUNCTION(){$("HTML, BODY").ANIMATE({SCROLLTOP:0},"SLOW")})}});

$(FUNCTION() {
$("#TOTOP").SCROLLTOTOP();
});
</SCRIPT>

 8. Save your template and you are done!