• digg
  • google-plus
  • facebook
  • twitter
  • feed
  • delicious

3 Langkan Cara Pasang Tombol Back To Top

Written By Rusman Edi on Wednesday, January 15, 2014 | 4:39 PM
Anda suadah tau apa itu tombol back to top.!, Back to top dalah tombol yang di pasang pada sebagian pemilik blog yang di fungsikan sebagai scroll kembli keatas dari bagian fotter menuju header blog secara automastis hanya dengan sekali klik saja,Banyak jenis dari applikasi back to top ini salah satunya seperti yang akan saya share buat sobat semua di bawh ini.
 Tombol back to top ini sangat penting untuk di pasang pada blog sobat tujunya agar pengunjung blog sobat tidak perlu bersush payah menggulirkan mouse untuk kembali ke bagian header blog,Ini sangat di perlukan apa lagi jika isi dari konten blog sobat memakan lahan yang cukup luas dari header ke bgian fotter.

Caranya sebagi berikut ;
1."Login ke akun blogger" > "Edit HTML" > " Cari code ]]></b:skin>" > "Jika sudah ketemu simpan Css di bawah ini tepat di atas code "]]></b:skin>"
.kembali-ke-atas {
position:fixed;
bottom:20px;
right:20px;
background: url("http://sepatutrends.com/catalog/view/theme/sepatutrends/image/top_scroller.png") left top no-repeat;  <-ganti url gambar ini sesuai keinginan anda->
width:19px;
height:20px;
}
.kembali-ke-atas :hover {
background: url("http://sepatutrends.com/catalog/view/theme/sepatutrends/image/top_scroller.png") left -30px no-repeat; <-ganti url gambar ini sesuai keinginan->
}
.kembali-ke-atas a {
padding:20px ;
display:block;
}
2.Selanjutnya masih di bagian "Edit HTML" cari code "</body>" jika sudah ketemu simpan code di bawah ini tepat di atas code "</body>"
<div class='kembali-ke-atas' id='kembali'><a class='kembalikeatas' href='javascript:void(0)' title=''></a></div>
<script type='text/javascript'>
$(function () {
        $(window).scroll(function () {
            if ($(this).scrollTop() > 100) {
                $('#kembali').fadeIn();
            } else {
                $('#kembali').fadeOut();
            }
        });
        });
jQuery('.kembalikeatas').click(function(){
    jQuery('html, body').animate({scrollTop:0}, 'slow');
});
</script>
 3.Periksa kembali semuanya jika sudah benar "Save Template" sobat.selesai

Itulah 3 langkah cara pasang tombol back to top,Dan silahkan baca juga arikel lainya terkait tutorial blogspot,Selanjutnya...
Advertisement
*Pilih Tab Komentar Yang Di Inginkan->
Comments
0 Comments

Post a Comment

Berikan Komentar Sesuai Dengan Kebijakan Dan Privasi Kami.!