Jquery Top Button

adalah tombol untuk scroll otomatis ke atas halaman blog dengan efek jquery, tombol akan terlihat otomatis saat halaman berada di footer blog. Dan akan menghilang saat tombol berada di halaman atas blog.



LIVE DEMO



Cara:

1. login blog

2. template dan edit html

3. letakkan kode css di atas  ]]></b:skin>

#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; }

4. letakkan script di atas </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><script type='text/javascript'>

$(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> 

abaikan yang berwarna cyan jika anda sudah mempunyai js jquery versi berapapun



4. Letakkan script di atas </body>

<a href='#' id='toTop'><img src='URL IMG?t=1292762029' style='border:0;'/></a>

 5. Ganti URL IMG dengan url gambar anda.



Teks/button/tombol back to top





https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCyMijiNhyphenhyphenlJdGsCaSCIHe_jTRjNCXdYbhwvwmUM9qPCp5GsPXv69iJMQCzcD6wVhJTItq-Hs2SmWVRZk9AzX4Fgz94rKYtfS00Tx-Gryzosq0bls_fh4SlnCJE5c_d0yguI_vOsw9sw/s1600/top-pink+copy.png





https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX2GnAiytYmKFqdEkKRHVjQLVcAdBiM8Q6DvJzRmVipbFKXKPXli9B_YEnAe8JNqylPkLLp4CZE728k_8utT7j0Alci0-m9zzjz1AmPUIzn7uuBkrtlhOSARVsPYcX0gsBbpjj0houdA/s1600/top-purple.png



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKZrE6q8VTIdmUA8I2Bw7MWdRXtoEvoDCMnVRLoY19EiwZatfhJnsp7pRqIqt5p-_MEI8L1dp4KXhWmDGX65avfaywJqJtdzbu_TAHdXbxqvFcP4cVwX5OBk9wg0g7GHBpqvzDz2HWVw/s1600/top-blue.png



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUHY8inN15hi9qHtK_SmWFyemj_bNgGLpyqG77h9M6XSgrP33xmrDkWh8urDgSGqQcAfr4-rPOslxUb3EzKEHoFjSPgo8Ord5VPRx4c3GZJKSTRnMOG56qKfla9TxEsNdl-83CgYCC5g/s1600/top-orange.png



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZCIs_VH8_uUZAb9wiZLYwpXGCRAXdPJKJLEgqfUO32S5sTwKS7baS60hN0IAyPM4y6iBktUslxe29bClhNAw2QHa1RokDpgTY2jjt_F9VCplL_KneZX66qgsaKg_MJPICAG1vAqg06A/s1600/top-black.png