Rabu, 10 Oktober 2012

Cara Membuat Back To Top Dengan Efek Bounce



Ok Kali Ini DRobani Akan Memposting Lagi Nih Tentang Tutorial Blog Cara Membuat Back To Top Dengan Efek Bounce Mungkin Di Blog yg lain Udah Banyak yg Post Cara Membuat Back To Top Dengan Efek Bounce Tapi Gak Papa Ok langsung Aja

1. Buka Blogger > Rancangan > Edit HTML
2. Centang Expant Template Widget Lalu Cari Code ]]></b:skin>
3. Setelah Itu Lalu Letakan Code Dibawah Ini Di Atas Code ]]></b:skin>

#DRobaniTop {text-align:center;position:fixed;bottom:0px;right:10px;cursor:pointer;        display:none;color:#000; font-family:verdana;font-size:11px;}
4. Dan Taruh Juga Code Dibawah Ini Di Atas Code </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'/><script type='text/javascript'>$(function() { $(window).scroll(function() { if($(this).scrollTop() &gt; 100) { $(&#39;#IrvanTop&#39;).fadeIn(); } else { $(&#39;#IrvanTop&#39;).fadeOut(); } });
$(&#39;#IrvanTop &gt; img&#39;).click(function() { $(&#39;body,html&#39;).animate({scrollTop:0},800) .animate({scrollTop:25},200) .animate({scrollTop:0},150) .animate({scrollTop:10},100) .animate({scrollTop:0},50); }); });</script>
5. Lalu Cari Code </body> Dan Letakan Code Dibawah Ini Diatas Code </body>




<div id='DRobaniTop'><img src='URL+GAMBAR+BackToTop' style='margin-right:-9px'/></div>  
6. Selesai Tinggal Save Template

Jangan Lupa Komentar Ya ^_^


Artikel Terkait

Tidak ada komentar:

Posting Komentar