Membuat Back To Top dengan Efek Bounce Keren

Pertama Sobat Login Dulu Blognya.

Terus Masuk ke menu Template, Centang Expand Template Widget, Cari Kode </head>

Kemudian Copy dan paste kdoe berikut ini Di atas kode </head>

KODE CSS/JAVASCRIPT :

<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;#HermanbagusTop&#39;).fadeIn(); } else { $(&#39;#HermanbagusTop&#39;).fadeOut(); } });

$(&#39;#HermanbagusTop &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>

Kemudian Simpan.

Langkah Kedua, Masuk ke Menu Tata letak, Tambahkan Gadget, Html / Javascript.
Copy dan paste kode berikut pada menu Html/ Java script.

KODE CSS/JAVASCRIPT :

<style>

#HermanbagusTop { text-align:center; position:fixed; bottom:0px; right:10px; cursor:pointer; display:none;}

</style>

<div id='HermanbagusTop'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE76lKRBuunhvowVZ8nuMoxLU2VOXQfMgsB6dgN40b8_cn6qikjRY9nNPek_Q9o2W31p9iuXp7nzCwcFKT7yOfknwn6bNZ6Q825Ks8DPfVjYvcHnfjqS4tGoDiL15cW3vOKVM-ojumt0Q/s150/back+to+top+hermanbagus.png' style='margin-right:-9px'/></div>

Kemudian Simpan dan Lihat Hasilnya, selamat mencoba dan berkreasi >>