Trik memasang tombol smoot scroll to top atau pasang tombol Back to Top dengan bergeser lembut / perlahan ke atas di halaman blog / Blogger sangat mudah sekali. Biasanya sering kita temukan tombol navigasi kembali ke atas di setiap blog dgn bergerak cepat dan tiba-tiba. Nah, kalo ini adalah cara agar saat tombol back to top di klik maka akan bergeser dgn lembut / halus ke bagian halaman atas. Juga tombol ini hanya akan muncul di bag tengah halaman ketika pengunjung melakukan scroll ke bagian bawah halaman konten blog kita. Trik ini sy dapatkan setelah melakukan gogling dan beruntung menemukannya di http://way2blogging.org - dan bisa dilihat hasilnya di bagian kanan bawah halaman.
Kalau tertarik, silahkan login ke blog > Design > Edit HTML
Kemudian cari kode </head>, lalu simpan kode berikut tepat di atas </head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<style type="text/css">
#w2btoTop {display:none;text-decoration:none;position:fixed;bottom:10px;right:10px;overflow:hidden;width:51px;height:51px;border:none;text-indent:-999px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk3m1JV1hYKn8PDixFYzzdUlsdiLBXIS4YF1A-mvzx3OAPYvs3JyZCCE4xJEOtAri2trf20i7dvk29z0P8Hzqh6m5O9jcRtXt7fIz1clQvtv0-Z41pQ0JrVvLPRSZTbt9wdp_8kK1ge_Z-/) no-repeat left top;}
#w2btoTopHover {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk3m1JV1hYKn8PDixFYzzdUlsdiLBXIS4YF1A-mvzx3OAPYvs3JyZCCE4xJEOtAri2trf20i7dvk29z0P8Hzqh6m5O9jcRtXt7fIz1clQvtv0-Z41pQ0JrVvLPRSZTbt9wdp_8kK1ge_Z-/) no-repeat left -51px;width:51px;height:51px;display:block;overflow:hidden;float:left;opacity: 0;-moz-opacity: 0;filter:alpha(opacity=0);}
#w2btoTop:active, #w2btoTop:focus {outline:none;}
</style>
<script src="http://bloggerblogwidgets.googlecode.com/files/w2b_jquery.ui.totop.js" type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function(){ $().UItoTop({ easingType: 'easeOutCubic' }); });
</script>
Kalau ingin mengganti gambar icon tombol, silahkan ganti yang berwarna orange dgn url tombol icon yg diinginkan agar cocok dgn template blog Anda.Selamat memasang tombol Back to Top bergerak Lembut dan perlahan di blog Anda.
Post a Comment