IlhamiZation- Sore Sahabat blogger!. bingung nyari cara gimana bikin Back To Top dengan Efek Keren?... ndak usah bingung karena saya sudah mempersiapkan tutorial ini kepada kalian semua!.
langsung aja ya!.
- Pertama buka Blogger > Rancangan > Edit HTML > jangan lupa klik Expand Template Widget
- Kalo Udah Copy Kode dibawah ini!
#toTop { text-align:center; position:fixed; bottom:0px; right:10px; cursor:pointer; display:none; color:#000; font-family:verdana; font-size:11px;}
- Taruh Code diatas, diatas tag ]]></b:skin>
- Oke! Lanjut ke kode </head> n taruh script di bawah ini, dibawah 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) { $('#toTop').fadeIn(); } else { $('#toTop').fadeOut(); } });
$('#toTop > 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>
- kalo udah Copy kode dibawah ini!
<div id='toTop'><!-- Back to top animation written by farizemo | edited by ilham mboh --><img src='http://picturestack.com/408/690/3RMToTopyonbijEz.png' style='margin-right:-9px'/></div>
Lalu klik
SIMPAN TEMPLATE
NB : http://picturestack.com/408/690/3RMToTopyonbijEz.png dapat kamu ganti dengan url gambarmu sendiri
Lihat Hasilnya!
Script saya copy dari Sini dengan sedikit pengubahan!
Sekian mas bro semoga berhasil n bermanfaat!
{ 0 komentar... Views All / Send Comment! }
Posting Komentar