1. Login to your blogger's
blog
Note:It is adviceable to save
your template before editing your
html.
2. Click Template->Edit
Html
3. Search for ]]></b:skin>
4. Add the code below, above
]]></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; }
5. Now search for </body>
tag and add the below code before the </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>
6. SAVE template
That's all, thank you all!
0 Comments