Menambah widget back to top,memang tidak di sarankan,tapi menurut saya widget back to top,penting dan harus juga di pasang di blog,karena dapat mempermudah dan mempersingkat untuk kembali pada halaman blog paling atas,daripada harus scroll-scroll pada mouse. . Nah pada postingan saya kali ini saya akan berbagi tips atau cara menambah widget back to top dengan efek bounce atau memantul setelah sampai di halaman atas. .ya mungkin sudah banyak blogger yang membahas tutorial ini, . .tapi tidak ada salahnya saya berbagi dengan cara yang saya tau. .oke langsung saja ke caranya sob. . !!
CARA MEMASANG WIDGET BACK TO TOP
- Masuk ke blogger dasbord kalian
- Pilih menu tempelate >> Edti HTML
- Cari kode </head> pada tempelate anda
- Selanjutnya Script di bawah ini,dan pastekan tepat diatas kode </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() > 100) {
$('#ElitesRunTop').fadeIn(); } else { $('#ElitesRunTop').fadeOut();
} });
$('#ElitesRunTop>
img').click(function() {
$('body,html').animate({scrollTop:0},800)
.animate({scrollTop:25},200) .animate({scrollTop:0},150)
.animate({scrollTop:10},100) .animate({scrollTop:0},50); }); });</script>
- Kalau sudah save tempelate anda
- sekarang ke menu tata letak
- Tambah gadget, Html/javascript
- Copy script di bawah ini dan pastekan di kotak HTML/Javascript tadi
<style>
#ElitesRunTop { text-align:center; position:fixed; bottom:0px; right:10px; cursor:pointer; display:none;}
</style>
<div id='ElitesRunTop'><img src='http://cdn1.iconfinder.com/data/icons/super-mono-basic/blue/arrow-up_basic_blue.png' alt='Back to top' style='margin-right:-9px'/></div>
Kalau sudah yaa di save dan lihat hasilnya,sekarang di blog anda sudah terpasang widget back to top dengan efek bounce atau memantul. .selamat mencoba dan ber eksperimen. . :)
NO SPAM :
Komentar memasukan link aktif tidak akan di tampilkan atau terhapus secara otomatis.
EmoticonEmoticon