TUTORIAL : Back To Top

Assalamualaikum

Zati nak share tutorial back to top button. Selalu nya akan muncul icon ni bila kita dah scroll blog kebawah. Ada dua jenis tuto ye.

Tutorial Pertama

1. Layout > Add Gadget > HTML
2. Copy code bawah ni dan paste kan ke dalam HTML tadi

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Top"><img src="URLIMAGE" /></a>

3. Save !

Tutorial Kedua

1. Theme > Edit HTML > Ctrl+F
2. Cari code 

</body>

3. Copy code bawah ni , sebelum code yang korang cari tadi

<a href='#' id='toTop'><center>YOUR WORDS<span class='Apple-style-span' style='color: rgb(255, 204, 204); '/></center><img src='ICON CHOMEL/TOP BUTTON?t=1292762029' style='border:0;'/></a>

4. Cari pulak code ni

]]></b:skin>

5. Lepastu, copy code bawah ni pulak , paste kan sebelum code no4 tadi

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

6. Last step , cari code ni

</head>

7. Lepas tu copy code bawah ni dan paste kan sebelum code no6 tadi

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><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 &quot;Scroll to Top&quot; 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(&quot;href&quot;);if($(window).scrollTop()!=&quot;0&quot;){$(this).fadeIn(&quot;slow&quot;)}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()==&quot;0&quot;){$(scrollDiv).fadeOut(&quot;slow&quot;)}else{$(scrollDiv).fadeIn(&quot;slow&quot;)}});$(this).click(function(){$(&quot;html, body&quot;).animate({scrollTop:0},&quot;slow&quot;)})}}); 

$(function() { $(&quot;#toTop&quot;).scrollToTop(); }); 

</script>

8. Okay dah siap! Preview dan Save !

Nota : Boleh ambil freebies sini > Top Button Freebies